首页 »Dreamweaver » dreamweaver制作:Dreamweaver如何制作浮动广告 »正文dreamweaver制作:Dreamweaver如何制作浮动广告来源: 发布时间:星期四, 2009年2月12日 浏览:76次 评论:0
漫游于网络的间你会发觉因特网不但是信息海洋也是广告海洋除了普通G Banner、Flash外浮动广告也是时下网上较为流行广告形式的当你拖动浏览器滚动条时这种在页面上浮动广告可以跟随屏幕起移动尽管这种效果对于广告展示有相当实用价值但对浏览你网页人来讲这则是个既妨碍阅读又影响阅读兴趣东西因此定不能滥用不过如果你能善用话它就能发挥出极大作用 要做出浮动式广告效果并不困难如果你有JS基础可以自己写个如果连写都懒得写话到网上下载个特效工具按提示粘贴下代码就OK不过想要真正了解它是怎样做出来则需要掌握些JS知识了这里向大家介绍下简单浮动广告做法 以下这段代码可放在<body></body>的间其间我加入了些注释(即“//”后文字及“<!—”“-->”的间文字) <SCRIPT FOR=window EVENT=onload LANGUAGE=\"JScript\"> initAd;//载入页面后initAd </SCRIPT> <script language=\"JScript\"> <!-- function initAd { document.all.AdLayer.style.posTop = -200;//设置onLoad事件激发以后广告层相对于固定后y方向位置 document.all.AdLayer.style.visibility = \'visible\'//设置层为可见 MoveLayer(\'AdLayer\');//MoveLayer } function MoveLayer(layerName) { var x = 600;//浮动广告层固定于浏览器x方向位置 var y = 300;//浮动广告层固定于浏览器y方向位置 var df = (document.body.scrollTop + y - document.all.AdLayer.style.posTop)*.40; var y = document.body.scrollTop + y - df; eval(\"document.all.\" + layerName + \".style.posTop = y\"); eval(\"document.all.\" + layerName + \".style.posLeft = x\");//移动广告层 Timeout(\"MoveLayer(\'AdLayer\');\", 20);//设置20毫秒后再MoveLayer } //--> </script> <!--下面为个ID为AdLayer层(如ID名不为AdLayer上面MoveLayer内AdLayer也要作相应修改)包括张带链接图片--> <div id=AdLayer style=\'position:absolute; width:61px; height:59px; z-index:20; visibility:hidden;; left: 600px; top: 300px\'> <a href=\"http://www.5dmedia.com/bbs\"><img src=\"http://127.0.0.1/Files/BeyondPic/2007-4/19/0741913395547732.g\" border=\"0\" height=\"60\" width=\"60\"></a> </div> 在这里你可以设置x、y值来设定所固定层位置改变Timeout(\"MoveLayer(\'AdLayer\');\", 20)中20值为你希望MoveLayer时间间隔还有要注意是使用图片最好为透明背景g图以使图片背景颜色不至于遮住后面内容 切记要慎用浮动式广告考虑使用特效同时千万要考虑到浏览者感觉不能滥用哦! 0
相关文章
读者评论发表评论 |