悬浮广告：JS实现网站悬浮广告 2024-04-20 11:06:00 0 0 如图 黄色区块会沿着浏览器的上下左右碰撞移动,可关闭,鼠标移上去会停止<!doctype html><html><he><meta charset="utf-8"><title>广告</title><style type="text/css">*{pding:0px;margin:0px;}#ad{position:absolute;left:0px;top:0px;width:200px;height:50px;line-height:50px;text-align:center;color:black;background-color:orange;border-rius: 2%;}</style></he><body><div id="ad">广告位招商</div></body><script type="text/javascript">//获取imgad=document.getElementById("ad");//初始化横坐标x=0;//设置纵坐标y=0;//设置加速度yv=10;xv=10;function fun(){//范围//左右if(x<0||x>window.innerWidth-ad.offsetWidth){xv=-xv;}//上下if(y<0||y>window.innerHeight-ad.offsetHeight){yv=-yv;}x+=xv;y+=yv;//获取到的x值赋值给ad的leftad.style.left=x+"px";//获取到的y值赋值给ad的topad.style.top=y+"px";}mytime=setInterval(fun,100);//给ad绑定鼠标移入事件ad.οnmοuseοver=function(){//清除定时器clearInterval(mytime);}//鼠标移出ad.οnmοuseοut=function(){mytime=setInterval(fun,100);}</script></html> 收藏（0）