自动加载CSS代码，当网站是开放

Question

这是HTML代码：

<div class="box"> 
    <a class="button" href="#popup1">Let me Pop up</a> 
</div> 

<div id="popup1" class="overlay"> 
    <div class="popup"> 
     <h2>Here i am</h2> 
     <a class="close" href="#">&times;</a> 
     <div class="content"> 
      Thank to pop me out of that button, but now i'm done so you can close this window. 
     </div> 
    </div> 
</div> 

我想打开的网页，盒（弹出式）自动加载时和删除按钮。

Answer 1

你需要为这些事情学习jQuery。 看看这个文件。 https://jqueryui.com/dialog/

Answer 2

这里弹出：

jQuery(window).load(function(){ 
 
jQuery('#popup1').fadeIn(); 
 

 
}); 
 
jQuery('.close').click(function(){ 
 

 
jQuery('#popup1').fadeOut(); 
 

 
});

#popup1{position:fixed;left:0;top:0;background:rgba(0,0,0,.5);z-index:1;width: 100%; 
 
    height: 100%;display:none} 
 
.popup{position:fixed;width:200px;height:200px;left:0;right:0;top:0;bottom:0;margin:auto;background:#000;z-index:2;color:#fff} 
 
.close{position:absolute;top:0;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="box"> 
 
    <a class="button" href="#popup1">Let me Pop up</a> 
 
</div> 
 

 
<div id="popup1" class="overlay"> 
 
    <div class="popup"> 
 
     <h2>Here i am</h2> 
 
     <a class="close" href="#">&times;</a> 
 
     <div class="content"> 
 
      Thank to pop me out of that button, but now i'm done so you can close this window. 
 
     </div> 
 
    </div> 
 
</div>