js 弹窗

帆 2024-04-29 0 阅读 评论
  <style type="text/css">
  .tanchuang {
  /* display: none; */       /* 这个display:none要设置在html文档,不然会对页面造成第一次点击失败,需要点击二次才能显示隐藏div */
  position: fixed;          //定位
  top: 50%;
  left: 40%;
  background-color: red;
  margin-top: -200px;
  width: 300px;
  height: 300px;
  }
  .khbox {
  padding: 10px;
  background-color: #d5d5d5;
  }
  </style>
  <script type="text/javascript">
  function divtc(){
  //获取ID名为tc01的标签 点击按钮把它的style样式改为隐藏
  if(document.getElementById("tc01").style.display=="none"){
  //获取ID名为tc01的标签 点击按钮把它的style样式改为显示
  document.getElementById("tc01").style.display="block";
  }else{
  document.getElementById('tc01').style.display='none';
  }
  }
  </script>
  <a onclick="divtc()">立即咨询</a>
  <!-- 弹窗 -->
  <div class="tanchuang" id="tc01" style="display: none">
  <div class="khbox">
  </div>
  </div>

文章声明:以上内容(如有图片或视频亦包括在内)除非注明,否则均为时光荏苒原创文章,转载或复制请以超链接形式并注明出处。