tml代碼如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>網頁的頂端海報彈框操作</title> </head> <body> <div id="ad" style="width:100%;display: none;"> <img src="img/banner1.jpg" width="100%" /> </div> </body> </html>
JavaScript代碼如下:
<script type="text/javascript">
//記錄次數
var i=0;
//定時器id
var timer;
onload=function(){
//設置定時器 間隔4秒后展示圖片
timer=setInterval(showAd,4000);
}
//展示廣告方法 展示2秒之后隱藏
function showAd(){
//展示的次數加1
i++;
//若i=3 清空由setinterval設置的定時器
if(i==3){
clearInterval(timer);
}
//1.獲取廣告
var divObj=document.getElementById("ad");
//2.修改廣告的樣式 將其顯示
divObj.style.display="block";
//3.2秒之后隱藏 只執行一次
setTimeout(hideAd,2000);
}
//隱藏廣告
function hideAd(){
//1.獲取廣告
var divObj=document.getElementById("ad");
//2.修改樣式 將其隱藏
divObj.style.display="none";
}
</script>
圖片素材: banner1
作者： 楊校
出處： http://www.cnblogs.com/xiaoxiao5016
分享是快樂的，也見證了個人成長歷程，文章大多都是工作經驗總結以及平時學習積累，基於自身認知不足之處在所難免，也請大家指正，共同進步。
本文版權歸作者所有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出, 如有問題， 可郵件（397583050@qq.com）咨詢。