純js實現(xiàn)可惡的彈出廣告
利用setInterval（“表達(dá)式”慌随，1000）動態(tài) 時間定時器吼鳞，clearInterval（）清除定時器 ?
樣式部分：
div{
position:absolute;
background: #AA0000;
color: #fff;
font-size: 12px;
padding: 20px;
text-align: center;
width: 80px;
line-height: 24px;
border-radius:100%;
}
HTML部分
<div? id = "ad">我是可愛又可憐的廣告君 </div>
JS部分
<script>
var x=0;
var y=0;
var xs=10;
var ys=10;
var adt = document.getElementById("ad");//獲取廣告這個節(jié)點對象
/*設(shè)置函數(shù)粘舟，讓廣告動起來*/
function move(){
x += xs;
y += ys;
//clientWidth 為瀏覽器寬度? offsetWidth元素自己的寬度? -20 滾動條的寬度
if(x >= document.documentElement.clientWidth-adt.offsetWidth-20 || x <= 0)//廣告君活動的范圍 判斷? （超出瀏覽器寬度 反向運動）
{
xs = -1*xs;//改變方向
}
if( y >= document.documentElement.clientHeight-adt.offsetHeight-20 || y<=0)
{
ys = -1*ys;
}
adt.style.left = x+"px";//px不能丟
adt.style.top = y+"px";//px不能丟
}
/*設(shè)置定時器*/
var dt = setInterval("move()",200);
adt.onmouseover = function(){
clearInterval(dt);
}
adt.onmouseout = function(){
dt = setInterval("move()",200);
}
</script>
ps 凡是頁面中活動的模塊兄渺，基本都是脫離文檔流择浊，也就是定位處理過范咨，切記。
