纯js网页浮动广告代码

07-22 09:33   原创 77 责编:寂静的神经

网上一般的网页浮动广告代码都是基于jquery的,受jiquery版本及浏览器限制,非常容易出现不兼容的情况,本站分享一段纯js网页浮动广告代码,简单兼容。

html代码:


<div id="ad" style="position:absolute;z-index:9999">
  <a href="http://www.02405.com" target="_blank">
    <img src="/images/welcome.jpg" border="0">
  </a>
</div>

javascript代码:


<script>
window.onload=function(){
  var x=50,y=60;
  var xin=true, yin=true;
  var step=1;
  var delay=10;
  var obj=document.getElementById("ad");
  function float(){
    var L=T=0;
    var R=document.documentElement.clientWidth-obj.offsetWidth;
    var B =document.documentElement.clientHeight-obj.offsetHeight;
    obj.style.left=(x+document.body.scrollLeft||document.documentElement.scrollLeft)+"px";
    obj.style.top=(y+document.body.scrollTop||document.documentElement.scrollTop)+"px";
    x = x + step*(xin?1:-1);
    if(x < L){ xin = true; x = L}
    if(x > R){ xin = false; x = R}
    y=y + step*(yin?1:-1)
    if(y < T){ yin = true; y = T }
    if(y > B){ yin = false; y = B }
  }
  var flag= setInterval(float, delay)
  obj.onmouseover=function(){clearInterval(flag)}
  obj.onmouseout=function(){flag=setInterval(float, delay)}
}
</script>

 

分享给小伙伴们:

最新文章

最热文章

零五科技,分享IT知识,国内顶级IT知识门户网站。

©2015 零五科技 版权所有