<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: red;
position: fixed;
bottom: 0;
right: 0;
display: none;
}
#close{
position: absolute;
left: -20px;
}
</style>
</head>
<body>
<div id="dis">
<span id="close" onclick="btn();">X</span>
過<span id="second">5</span>秒後關閉
</div>
</body>
<script>
var s = document.getElementById("dis")
var second = document.getElementById("second");
var timer = null;
var timeOut = setTimeout(function(){
s.style.display = "block";
timer = setInterval(function(){
second.innerText--;
if(second.innerText == 0){
clearInterval(timer)
s.style.display = "none";
}
},1000)
},1000)
function btn(){
s.style.display = "none";
clearInterval(timer);
}
</script>JavaScript 定時器製作一個彈窗小廣告
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章