灵动游戏论坛游戏专区【游戏教程】[转帖]各大网站主页常用特殊效果分析及应用方法

1  /  2  页   12 跳转页 查看:2713

标题: [转帖]各大网站主页常用特殊效果分析及应用方法

帅哥离线 灵翼
灵翼
称号:灵动大佬

  • 头衔:灵动管理员
  • UID:2
  • 精华贴: 4
  • 威望值: 100
  • 魅力点: 0
  • 功勋值: 2
  • 经验数: 180
  • 积分点: 138
  • 灵动币: 398
  • 状态: 离线 帖子:382
  • 最后报道: 2008-11-23
2005-12-04 03:41 | 只看楼主
树型| 收藏| 小 中 大 1

[转帖]各大网站主页常用特殊效果分析及应用方法

平时上班，最常做的事就是去各大门户网站看看新闻。
于是发现个大门户网站主页上的特殊效果不禁相同（如左右上角的FLASH旗标，左右下角的小FLASH浮标，背投广告等）。这种问题难不倒高手，可是对于新手来说，是非常希望学会的。现在我就来逐一分析一下门户网站主页的特殊效果。
1。首先分析左右上角FLASH旗标的制作方法。（如下图所示）
[/URL][IMG=0,absMiddle]http://bbs.flash8.net/bbs/UploadFile/2005-11/20051116141242960.jpg[/IMG]
  通过分析代码可以发现，页面中有这样一段话。

<SCRIPT FOR=’tomdl’ EVENT=’FSCommand()’ LANGUAGE=’JavaScript’>
dllayer2.style.visibility=’hidden’;
dllayer3.style.visibility=’hidden’;
</script>
<script src=http://ad.tom.com/zhf/lenovo/1110-hdl.js></script>

这段话是通过1110-hdl.js这个页面来调用FLASH到页面的相应位置。所以说主要的属性设置都是在1110-hdl.js这个页面里。我们按照地址把这个页面DOWN下来。由于不能上传JS文件，故我先把代码贴上来

function winload()
{
dllayer2.style.top=20;
dllayer2.style.left=5;
dllayer3.style.top=20;
dllayer3.style.right=5;
} //这段分别是对FLASH图标在页面上的位置的设定（上边距和左右边距的数值）
if(document.body.offsetWidth>800){ 
{
document.write("<div id=dllayer2 style=’position: absolute;visibility:visible;z-index:1’><EMBED src=’http://ad.tom.com/zhf/lenovo/1110-hdl.swf' quality=high  WIDTH=100 HEIGHT=300 TYPE=’application/x-shockwave-flash’ id=tomdl></EMBED></div>"
+"<div id=dllayer3 style=’position: absolute;visibility:visible;z-index:1’><EMBED src=’http://ad.tom.com/zhf/lenovo/1110-hdl.swf' quality=high  WIDTH=100 HEIGHT=300 TYPE=’application/x-shockwave-flash’ id=tomdl></EMBED></div>");//这段话是载入FLASH的路径以及对FLASH的相应的一些设置。
}
  winload()
}

可能一些初学者看到这里觉得有点乱，现在我就教大家如何把这几段代码用到自己的网站上去。
1.首先新建一个页面1.htm,随意地建一个居中的表格设定宽为600，长为500。     
2.将以下代码拷入BODY中

[TABLE=#000000,0,0,100%,#fff5cc,1][TR][TD] <SCRIPT FOR=’tomdl’ EVENT=’FSCommand()’ LANGUAGE=’JavaScript’>
dllayer2.style.visibility=’hidden’;
dllayer3.style.visibility=’hidden’;
</script>
<script src="1110-hdl.js"></script>

[/TD][/TR][/TABLE]

3.编辑1110-hdl.js页面。主要是改载入SWF的路径

[TABLE=#000000,0,0,100%,#fff5cc,1][TR][TD] function winload()
{
dllayer2.style.top=20;
dllayer2.style.left=5;
dllayer3.style.top=20;
dllayer3.style.right=5;
} if(document.body.offsetWidth>800){ 
{
document.write("<div id=dllayer2 style=’position: absolute;visibility:visible;z-index:1’><EMBED src=’1.swf’ quality=high  WIDTH=100 HEIGHT=300 TYPE=’application/x-shockwave-flash’ id=tomdl></EMBED></div>"
+"<div id=dllayer3 style=’position: absolute;visibility:visible;z-index:1’><EMBED src=’2.swf’ quality=high  WIDTH=100 HEIGHT=300 TYPE=’application/x-shockwave-flash’ id=tomdl></EMBED></div>");
}
  winload()
}  [/TD][/TR][/TABLE]

4.编辑两个100*300的FLASH，导出两个SWF文件，分别取名为1.swf和2.swf。     
5.分别保存以上文件在同一目录下。运行1.htm看看效果

[IMG=0,absMiddle]http://bbs.flash8.net/bbs/UploadFile/2005-11/2005111615239951.jpg[/IMG]



接下来分析左右下角FLASH浮标的制作方法。（如下图所示）

[IMG=0,absMiddle]http://bbs.flash8.net/bbs/UploadFile/2005-11/20051116213245201.jpg[/IMG]

同样分析代码，得到

<SCRIPT language=JavaScript>
var ad_float_left_src = "http://ad.tom.com/zhf/tom/930free.swf";
var ad_float_left_type = "swf";
</SCRIPT>
<SCRIPT src="http://ad.tom.com/tomad/floatleft.js"></SCRIPT>

同样的可以发现是通过floatleft.js这个JS页面来调用并且设置左下角的FLASH浮标。相对应的floatright.js就是用来控制右下角的浮标的。
这次就不对floatleft.js这个页面的代码再做什么分析了。
直接介绍如何把这个效果应用到自己的网页中去

1.首先新建一个页面2.htm,随意地建一个居中的表格设定宽为600，长为500。     
2.将以下代码拷入BODY中。

[TABLE=#000000,0,0,100%,#fff5cc,1][TR][TD] <SCRIPT language=JavaScript>
var ad_float_left_src = "1.swf";
var ad_float_left_type = "swf";
</SCRIPT>
<SCRIPT src="floatleft.js"></SCRIPT>
<SCRIPT language=JavaScript>
var ad_float_right_src = "2.swf";
var ad_float_right_type = "swf";
</SCRIPT>
<SCRIPT src="floatright.js"></SCRIPT>[/TD][/TR][/TABLE]

3.这次不用对floatleft.js和floatright.js这两个页面进行编辑。想研究里面代码的，可以下载本例的附件查看这两个页面。
4.编辑两个80*80的FLASH，导出两个SWF文件，分别取名为1.swf和2.swf。
5.分别保存以上文件在同一目录下。运行2.htm看看效果。
(浮标会随着页面的滚动而浮动，本例由于页面短所以看不出此效果。)

[URL=http://bbs.flash8.net/bbs/UploadFile/2005-11/200511162203278.jpg][IMG=0,absMiddle]http://bbs.flash8.net/bbs/UploadFile/2005-11/200511162203278.jpg[/IMG]
gototop
引用
 
帅哥离线 hoo198512
hoo198512

  • 头衔:初来乍道
  • UID:4894
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 294
  • 灵动币: 0
  • 状态: 离线 帖子:91
  • 最后报道: 2008-08-22
2005-12-05 18:07 |
树型| 收藏| 小 中 大 2

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 龙人
龙人

  • 头衔:初来乍道
  • UID:6977
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 4
  • 灵动币: 0
  • 状态: 离线 帖子:8
  • 最后报道: 2008-08-20
2005-12-11 13:26 |
树型| 收藏| 小 中 大 3

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 毁灭№之神∴
毁灭№之神∴

  • 头衔:江湖新秀
  • UID:7173
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 15
  • 积分点: 7
  • 灵动币: 0
  • 状态: 离线 帖子:21
  • 最后报道: 2008-08-09
2005-12-19 20:07 |
树型| 收藏| 小 中 大 4

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 屁颠王子
屁颠王子

  • 头衔:初来乍道
  • UID:8203
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: -2
  • 经验数: 1
  • 积分点: 2
  • 灵动币: 0
  • 状态: 离线 帖子:10
  • 最后报道: 2008-06-14
2006-01-04 03:48 |
树型| 收藏| 小 中 大 5

Re:[转帖]各大网站主页常用特殊效果分析及应用方法

http://www.qqxyx.com/flash/1836.htm有人偷料拉
gototop
引用
 
帅哥离线 守月人
守月人

  • 头衔:初来乍道
  • UID:10032
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:2
  • 最后报道: 2006-01-04
2006-01-04 17:23 |
树型| 收藏| 小 中 大 6

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 54558284
54558284

  • 头衔:初来乍道
  • UID:777
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 49
  • 灵动币: 0
  • 状态: 离线 帖子:15
  • 最后报道: 2007-12-17
2006-01-17 11:45 |
树型| 收藏| 小 中 大 7

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 三祷
三祷

  • 头衔:江湖新秀
  • UID:8726
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 5
  • 积分点: 7
  • 灵动币: 0
  • 状态: 离线 帖子:32
  • 最后报道: 2008-08-23
2006-01-23 13:22 |
树型| 收藏| 小 中 大 8

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 hzxs754599
hzxs754599

  • 头衔:初来乍道
  • UID:5852
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: -2
  • 灵动币: 0
  • 状态: 离线 帖子:1
  • 最后报道: 2006-03-25
2006-01-25 11:49 |
树型| 收藏| 小 中 大 9

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 干什么
干什么

  • 头衔:初来乍道
  • UID:11741
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 14
  • 灵动币: 0
  • 状态: 离线 帖子:6
  • 最后报道: 2006-04-06
2006-02-03 07:48 |
树型| 收藏| 小 中 大 10

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 喷火龙
喷火龙

  • 头衔:初来乍道
  • UID:12191
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:7
  • 最后报道: 2007-04-30
2006-02-03 16:51 |
树型| 收藏| 小 中 大 11

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 黄旗
黄旗

  • 头衔:初来乍道
  • UID:11740
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:14
  • 最后报道: 2006-03-05
2006-02-09 18:23 |
树型| 收藏| 小 中 大 12

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 云仗天
云仗天

  • 头衔:初来乍道
  • UID:13350
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:3
  • 最后报道: 2006-05-03
2006-02-16 03:51 |
树型| 收藏| 小 中 大 13

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 往往往往往往外
往往往往往往外

  • 头衔:初来乍道
  • UID:14130
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:1
  • 最后报道: 2006-02-20
2006-02-18 21:06 |
树型| 收藏| 小 中 大 14

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
帅哥离线 傻萝卜
傻萝卜

  • 头衔:初来乍道
  • UID:14964
  • 精华贴: 0
  • 威望值: 0
  • 魅力点: 0
  • 功勋值: 0
  • 经验数: 0
  • 积分点: 20
  • 灵动币: 0
  • 状态: 离线 帖子:3
  • 最后报道: 2006-03-02
2006-03-02 11:26 |
树型| 收藏| 小 中 大 15

Re:[转帖]各大网站主页常用特殊效果分析及应用方法
gototop
引用
 
<<上一主题|下一主题>>
1  /  2  页   12 跳转页

版权所有 灵动原创FLASH游戏中心   Sitemap

Powered by Discuz!NT 2.0.1214    Copyright © 2001-2008 Comsenz Inc.
Processed in 0.03125 second(s) , 4 queries. 苏ICP备05047165号
返顶部