2017-10-13 39 views
-3

這是HTML代碼:自動加載CSS代碼,當網站是開放

<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> 

我想打開的網頁,盒(彈出式)自動加載時和刪除按鈕。

+1

你嘗試過這麼遠嗎?堆棧溢出不是爲了給你寫代碼,但是如果你研究問題並告訴我們你錯在哪裏,大多數人都會很樂意提供幫助。我建議查看指南,以提出一個很好的問題https://stackoverflow.com/help/how-to-ask – TidyDev

回答

0

這裏彈出:

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>