国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 開發 > JS > 正文

javascript實現無法關閉的彈框

2024-05-06 16:33:11
字體:
來源:轉載
供稿:網友

大家都見過某網頁中的惡意廣告,你關閉了又出來了!為何,JS來告訴你

HTML

<body>  <h3 class="whiteColor">無法關閉的彈框,打不死的小強!</h3>  <div id="middleBox">    <a href="javascript:;" class="close_btn" id="closeBtn"><img src="images/close_icon.png"    <ul class="parent_btn">      <li><a href="/" class="btn_tel"><img src="images/icon_tel.gif"      <li><a href="/" class="btn_chat"><img src="images/icon_chat.gif"    </ul>  </div></body>

CSS

*{  margin: 0;  padding: 0;  list-style: none;  outline: none;  box-sizing: border-box;  text-decoration: none;}a { -webkit-touch-callout: none; text-decoration: none }:focus { outline: 0 }body{  font-family: Helvetica, STHeiTi, "Microsoft YaHei", sans-serif;  color: #595757;  background-color: #fff;  outline: 0;  overflow-x: hidden;  -webkit-tap-highlight-color:rgba(0,0,0,0);}img{  border: none;}.whiteColor{  color: #fff;  text-align: center;}.flex_parent{  display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex;  display: flex;}.flex_child{  -webkit-box-flex: 1;  -moz-box-flex: 1;  -webkit-flex: 1;  -ms-flex: 1;  flex: 1;}/*middle_box*/body{  position: relative;  background-color: #272822;}#middleBox{  width: 260px;  height: 248px;  margin: 0 auto;  background-image: url(../images/irfa_dog.jpg);  background-repeat: no-repeat;  background-size: 100% 100%;  border-radius: 10px;  /*水平垂直居中*/  position: fixed;  left: 50%;  top: 50%;  margin-top: -124px;  -webkit-transform: translateX(-50%);  -moz-transform: translateX(-50%);  -o-transform: translateX(-50%);  -ms-transform: translateX(-50%);  transform: translateX(-50%);  z-index: 100;}.close_btn{  display: block;  overflow: hidden;  position: absolute;  top: -10px;  right: -10px;}.will_close{  width:32px;}#middleBox a{  overflow: hidden;}#middleBox a img,#middleBox a span,#middleBox ul li{  float: left;}#middleBox a span{  font-size: 16px;  color: #fff;}#middleBox ul{  overflow: hidden;}#middleBox ul li{  width: 130px;}#middleBox ul li a{  line-height: 50px;  display: block;  padding-left: 5px;}#middleBox ul li a img{  width:30px;  margin-right: 2px;  margin-top: 8px;  margin-left: 5px;}.btn_tel{  background-color: #F92665;  border-bottom-left-radius: 10px;}.btn_chat{  background-color: #1EA362;  border-bottom-right-radius: 10px;}.parent_btn{  position: absolute;  left: 0;  bottom: 0;}

JS

/** * Created by Administrator on 2016/7/19. */var adv={  div:null,  timer:null,  btn:null,  init:function(){    this.btn=document.getElementById("closeBtn");    this.div=document.getElementById("middleBox");    this.btn.onclick=this.displayNone;  },  displayBlock:function(){    adv.div.style.display="block";  },  displayNone:function(){    adv.div.style.display="none";    timer=setTimeout(function(){      adv.displayBlock();    },3000);  }};window.onload=function(){  adv.init();};

以上就是本文的全部內容,希望對大家有所幫助,同時也希望多多支持VeVb武林網!


注:相關教程知識閱讀請移步到JavaScript/Ajax教程頻道。
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 汝州市| 灵山县| 绥芬河市| 东辽县| 莱州市| 沁水县| 剑阁县| 新巴尔虎左旗| 沁源县| 龙州县| 四会市| 大邑县| 富顺县| 清苑县| 九江县| 乡宁县| 霍城县| 延津县| 藁城市| 临桂县| 崇明县| 方城县| 长海县| 从化市| 汉中市| 库尔勒市| 永泰县| 莲花县| 威宁| 屯门区| 新晃| 临泽县| 蓬溪县| 乌拉特中旗| 福泉市| 广灵县| 沁水县| 武威市| 都江堰市| 汪清县| 沁水县|