本文实例为大家分享了基于javascript实现右下角浮动广告效果，供大家参考，具体内容如下
效果图：
具体代码：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>右下角广告代码</title> <script type="text/javascript"> window.onload = getMsg; window.onresize = resizeDiv; window.onerror = function(){} function $(id) {return document.getElementById(id);} //短信提示使用(asilas添加) var divT,divL,divW,divH,docH,docW,docST,docSL,objTimer,i = 0; function getMsg() { try{ divT = parseInt($("eMeng").style.top,10); //层top位置 divL = parseInt($("eMeng").style.left,10); //层left位置 divH = parseInt($("eMeng").offsetHeight,10);//层宽 divW = parseInt($("eMeng").offsetWidth,10);//层高 docW = document.documentElement.clientWidth;//窗口宽 docH = document.documentElement.clientHeight;//窗口高 docST=document.documentElement.scrollTop; docSL=document.documentElement.scrollLeft; $("eMeng").style.top = parseInt(docST,10) + docH + 10+"px"; $("eMeng").style.left = parseInt(docSL,10) + docW - divW+"px"; $("eMeng").style.visibility="visible"; objTimer = setInterval("moveDiv()",10); } catch(e){} } function resizeDiv() { try{ divH = parseInt($("eMeng").offsetHeight,10); divW = parseInt($("eMeng").offsetWidth,10); docW = document.documentElement.clientWidth; docH = document.documentElement.clientHeight; $("eMeng").style.top = docH - divH + parseInt(document.documentElement.scrollTop,10)+"px"; $("eMeng").style.left = docW - divW + parseInt(document.documentElement.scrollLeft,10)+"px"; } catch(e){} } function moveDiv() { try{ if(parseInt($("eMeng").style.top,10) <= (docH - divH + parseInt(document.documentElement.scrollTop,10))) { window.clearInterval(objTimer) objTimer = setInterval("resizeDiv()",1) } divT = parseInt($("eMeng").style.top,10); $("eMeng").style.top = divT - 1+"px"; } catch(e){} } function closeDiv() { $('eMeng').style.visibility='hidden'; if(objTimer) window.clearInterval(objTimer) } </script> <div id="eMeng"> <div> <div></div> </div> <div><a href="http://5.5fad.com/star/pur_detial.aspx" target="_blank"><img src="http://image.5fad.com/5/ad/ad01.jpg" width="225" height="164" border="0" /></a></div> </div> </body> </html>
希望本文所述对大家学习javascript程序设计有所帮助。
【基于javascript实现右下角浮动广告效果】相关文章：
★ 如何制作浮动广告