小广告经常出现在网页上,而且还是每隔一段时间出现,如何能够利用js实现效果呢?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
#dd{
position:fixed;
top: 50%;
margin-top:-125px;
}
span{
position: absolute;
top: 10px;
right: 3px;
background: red;
padding: 5px 12px;
border-radius: 12px;
font-size: 24px;
cursor: pointer;
/* 鼠标放上去变成小手 */
}
</style>
</head>
<body>
<div id="dd" >
<span id="dg">x</span>
<img src="img/13.png" width="250px">
</div>
<script>
var btn=document.querySelector("span");
btn.οnclick=function(){
//将div隐藏
this.parentNode.style.display="none";
//隔5秒再次显示
}
setInterval(function(){
dd.style.display="block";
},3000);
</script>
</body>
</html>