JavaScript实现网页上浮动广告
时间： 2021-07-31 作者：daque
遨游于搜集之间，你会察觉，因特网不只是消息的大海，也是告白的大海。除去普遍的gif 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 diff = (document.body.scrolltop + y - document.all.adlayer.style.postop)*.40; var y = document.body.scrolltop + y - diff; eval("document.all." + layername + ".style.postop = y"); eval("document.all." + layername + ".style.posleft = x");//挪动告白层 settimeout("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='../qqkk2000.gif' border="0" height="60" width="60"></a> </div>在这边，你不妨树立x、y的值来设定所恒定层的场所，变换settimeout("movelayer('adlayer');", 20)中20的值为你蓄意挪用movelayer()的功夫间隙。再有要提防的是，运用的图片最佳为通明后台的gif图，以使图片的后台脸色不至于遮住反面的的实质。牢记，要慎用浮动式告白，商量运用殊效的同声，万万要商量到欣赏者的发觉，不许乱用哦！
相关推荐
推荐下载
热门阅览
最新排行
- 1 手机如何装windows系统，手机装windows系统教程
- 2 微信公众号重大调整 新公注册公众号将没有留言功能
- 3 烧杯app最剧烈的反应有哪些？ 烧杯app攻略
- 4 微信小程序怎么用 微信小程序使用教程
- 5 360快剪辑怎么使用？360快剪辑图文视频教程
- 6 八分音符外挂神器：绝望中的战斗机
- 7 2017热门微信小程序排行榜 微信小程序二维码大全
- 8 微信聊天记录导出到电脑 怎么在电脑上查看微信聊天记录
- 9 在U递上赚钱和省钱教程 教你在U递上怎么赚钱何省钱
- 10 u递邀请码申请教程 u递邀请码领取方法
- 11 如何解决爱奇艺账号登陆验证 跳过爱奇艺账号手机登录验证方法分享 亲测好用
- 12 手机申请无限制申请QQ靓号 手机怎样无限申请Q号