導讀跟大家講解下有關JS實現網站懸浮廣告的代碼，相信小伙伴們對這個話題應該也很關注吧，現在就為小伙伴們說說JS實現網站懸浮廣告的代碼，小編
跟大家講解下有關JS實現網站懸浮廣告的代碼，相信小伙伴們對這個話題應該也很關注吧，現在就為小伙伴們說說JS實現網站懸浮廣告的代碼，小編也收集到了有關JS實現網站懸浮廣告的代碼的相關資料，希望大家看到了會喜歡。
本文主要和大家分享JS實現網站懸浮廣告的代碼，大家可以先看一下效果圖，希望能幫助到大家。如圖
黃色區塊會沿著瀏覽器的上下左右碰撞移動,可關閉,鼠標移上去會停止
<!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><p id="ad">廣告位招商</p></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.onmouseover=function(){//清除定時器clearInterval(mytime);}//鼠標移出ad.onmouseout=function(){mytime=setInterval(fun,100);}</script></html>相關推薦：
JS實現懸浮移動窗口(懸浮廣告)的特效
以上就是JS實現網站懸浮廣告的代碼的詳細內容，更多請關注php中文網其它相關文章！
來源：php中文網
免責聲明：本文由用戶上傳，如有侵權請聯系刪除！