网上一般的网页浮动广告代码都是基于 jquery 的,受 jiquery 版本及浏览器限制,非常容易出现不兼容的情况,本站分享一段纯 js 网页浮动广告代码,简单兼容。
html代码
<div id="ad" style="position:absolute;z-index:9999">
<a href="https://www.codesou.cn" 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>
想要了解更多内容,请持续关注码农资源网,一起探索发现编程世界的无限可能!
本站部分资源来源于网络,仅限用于学习和研究目的,请勿用于其他用途。
如有侵权请发送邮件至1943759704@qq.com删除
码农资源网 » 纯 js 网页浮动广告代码
本站部分资源来源于网络,仅限用于学习和研究目的,请勿用于其他用途。
如有侵权请发送邮件至1943759704@qq.com删除
码农资源网 » 纯 js 网页浮动广告代码