html手机广告倒计时弹屏6,广告弹窗关闭倒计时(示例代码)

无标题文档

#beiJ {

width:100%;

height:100%;

background:#000;

opacity:0.7;

position:fixed;

top:0;

left:0;

}

#tanChuang {

width:800px;

height:400px;

position:fixed;

top:50%;

left:50%;

margin:-200px 0 0 -400px;

background:#222;

box-shadow:0px 0px 20px #111;

color:#fff;

}

#jiShi {

width:180px;

height:180px;

border:10px solid #fff;

border-radius:50%;

margin:100px auto;

font-size:150px;

font-weight:bold;

font-family:"arial";

text-align:center;

line-height:180px;

position:absolute;

top:0%;

left:calc(50% - 100px);

}

#tanChuang img {

width:100%;

height:100%;

}

#tanChuang span {

width:40px;

height:40px;

font-size:40px;

position:absolute;

top:0;

right:0;

cursor:pointer

}

×

window.onload = function() {

var obj = document.getElementById("jiShi");

var sp = document.getElementById("sp");

var beiJ = document.getElementById("beiJ");

var tanChuang = document.getElementById("tanChuang");

var i = 30;

obj.innerHTML = i;

var a = setInterval(timeFn, 1000);

function timeFn() {

i--;

obj.innerHTML = i;

if (i == 0) {

clearInterval(a);

beiJ.style.display = "none";

tanChuang.style.display = "none";

}

}

sp.onclick = function() {

beiJ.style.display = "none";

tanChuang.style.display = "none";

}

}

《新程序员》：云原生和全面数字化实践50位技术专家共同创作，文字、视频、音频交互阅读

总结

以上是生活随笔为你收集整理的html手机广告倒计时弹屏6,广告弹窗关闭倒计时(示例代码)的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。