找回密码
 注册
搜索
热搜: 回贴

Html:各大网站主页常用特殊效果分析及应用方法

2009-12-16 02:22| 发布者: admin| 查看: 20| 评论: 0|原作者: 情殇

  平时上班,最常做的事就是去各大门户网站看看新闻。
于是发现个大门户网站主页上的特殊效果不禁相同(如左右上角的FLASH旗标,左右下角的小FLASH浮标,背投广告等)。这种问题难不倒高手,可是对于新手来说,是非常希望学会的。现在我就来逐一分析一下门户网站主页的特殊效果。
1。首先分析左右上角FLASH旗标的制作方法。(如下图所示)



通过分析代码可以发现,页面中有这样一段话。



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



这段话是通过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("
"
+"
");//这段话是载入FLASH的路径以及对FLASH的相应的一些设置。
}
winload()
}
可能一些初学者看到这里觉得有点乱,现在我就教大家如何把这几段代码用到自己的网站上去。
(1)首先新建一个页面1.htm,随意地建一个居中的表格设定宽为600,长为500。
(2)将以下代码拷入BODY中。

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("
"
+"
");//这段话是载入FLASH的路径以及对FLASH的相应的一些设置。
}
winload()
}
可能一些初学者看到这里觉得有点乱,现在我就教大家如何把这几段代码用到自己的网站上去。
(1)首先新建一个页面1.htm,随意地建一个居中的表格设定宽为600,长为500。
(2)将以下代码拷入BODY中。

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



(3)编辑1110-hdl.js页面。主要是改载入SWF的路径。
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("
"
+"
");
}
winload()
}
(4)编辑两个100*300的FLASH,导出两个SWF文件,分别取名为1.swf和2.swf。
(5)分别保存以上文件在同一目录下。运行1.htm看看效果。


本例源文件压缩包:点击这里下载源文件
2。接下来分析左右下角FLASH浮标的制作方法。(如下图所示)


同样分析代码,得到


同样的可以发现是通过floatleft.js这个JS页面来调用并且设置左下角的FLASH浮标。相对应的floatright.js就是用来控制右下角的浮标的。
这次就不对floatleft.js这个页面的代码再做什么分析了。
直接介绍如何把这个效果应用到自己的网页中去。
(1)首先新建一个页面2.htm,随意地建一个居中的表格设定宽为600,长为500。
(2)将以下代码拷入BODY中。




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

本例源文件压缩包:点击这里下载源文件

最新评论

QQ|小黑屋|最新主题|手机版|微赢网络技术论坛 ( 苏ICP备08020429号 )

GMT+8, 2024-9-30 21:36 , Processed in 0.216319 second(s), 12 queries , Gzip On, MemCache On.

Powered by Discuz! X3.5

© 2001-2023 Discuz! Team.

返回顶部