?
?
廣告樣式當頁面加載后5s刷新在右下角
?
<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>Gary圖片輪播</title><style type="text/css">#ad{width:300px;height: 300px;background-color:antiquewhite;/*絕對定位放置到瀏覽器右下角，即使有下拉條時廣告彈窗也不會改變位置*/position: fixed;bottom:0px;right: 0px;display: none;}</style><script type="text/javascript">function init(){setTimeout(showAd,2000)}function showAd(){var ad = document.getElementById("ad");ad.style.display ="block";}function closeAd(){var ad = document.getElementById("ad");ad.style.display ="none";}</script></head><body onload="init()"><div id="ad"><button onclick="closeAd()">關閉</button></div></body> </html>
?
?
實現過程
設置廣告彈窗樣式，將廣告樣式固定與頁面右下角
<body onload="init()"><div id="ad"></div></body>
?
<style type="text/css">#ad{width:300px;height: 300px;background-color:antiquewhite;/*絕對定位放置到瀏覽器右下角，即使有下拉條時廣告彈窗也不會改變位置*/position: fixed;bottom:0px;right: 0px;/*display: none;*/}</style>
?
? 設置廣告每隔5秒顯示出來
function init(){setTimeout(showAd,2000)}function showAd(){var ad = document.getElementById("ad");ad.style.display ="block";}
?
添加Button按鈕實現廣告的關閉
<body onload="init()"><div id="ad"><button onclick="closeAd()">關閉</button></div></body>
?
function closeAd(){var ad = document.getElementById("ad");ad.style.display ="none";}
?
?
?
<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>Gary圖片輪播</title><style type="text/css">#ad{width:300px;height: 300px;background-color:antiquewhite;/*絕對定位放置到瀏覽器右下角，即使有下拉條時廣告彈窗也不會改變位置*/position: fixed;bottom:0px;right: 0px;display: none;}</style><script type="text/javascript">function init(){setTimeout(showAd,2000)}function showAd(){var ad = document.getElementById("ad");ad.style.display ="block";}function closeAd(){var ad = document.getElementById("ad");ad.style.display ="none";}</script></head><body onload="init()"><div id="ad"><button onclick="closeAd()">關閉</button></div></body> </html>
?
