弹出框的页面重载

您好我只是觉得在谷歌的代码，我不知道如何触发弹出负载或网页箱子刷新弹出框的页面重载

HTML

<button id="LearnMoreBtn">Learn More</a> 
<div id="overlay"></div> 
<div id="popup"> 
    Popup contents here 
</div>

CSS

#overlay { 
    display:none; //This make it initially hidden 
    position:fixed; //This makes it so it says in a fixed position even if they scroll around 
    left:0px;  //This positions the element to the left most position 
    top:0px;   //This positions the elment to the top most position 
    width:100%;  //This makes the element take up 100% of the parents width 
    height:100%;  //This makes the element take up 100% of the parents height 
    background:#000; //Give it a black background 
    opacity:0.5;  //Change the opacity to 50% so that is see through. 
    z-index:99999; //Change the z-index so it will be above everything else 
} 

#popup { 
    display:none; 
    position:fixed; 
    left:50%;   //left and top here position top left page 
    top:50%;    //of the element to the center of the 
    width:300px;   //Set the popup to have a specific width/height 
    height:150px; 
    margin-top:-75px; //To get the popup to center correctly we need 
    margin-left:-150px; //To displace the the top/left margins by half of the width/height 
    background:#FFFFFF; //Background of white 
    border:2px solid #000; //And give it a border 
    z-index:100000;  is over the overlay 
}

JAVASCRIPT

window.onload = function() { 

    **document.getElementById("LearnMoreBtn").onclick = function(){** 
     var overlay = document.getElementById("overlay"); 

     var popup = document.getElementById("popup"); 


     overlay.style.display = "block"; 

     popup.style.display = "block"; 
    }; 
};

在此先感谢=）继承人的演示： http://jsfiddle.net/j4c7U/

来源

2013-12-12 Allen Aquino

入住这一点 -

window.onload = function() { 
    var overlay = document.getElementById("overlay"); 
    var popup = document.getElementById("popup"); 
    overlay.style.display = "block"; 
    popup.style.display = "block"; 

document.getElementById("CloseBtn").onclick = function(){ 
    var overlay = document.getElementById("overlay"); 
    var popup = document.getElementById("popup"); 
    overlay.style.display = "none"; 
    popup.style.display = "none";  
    } 
};

你只是不得不把弹出代码窗口中加载功能而不是从的onclick函数调用它。

http://jsfiddle.net/j4c7U/82/

来源

2013-12-12 10:45:57 skos

非常感谢你的作品很棒 –

如果你想打开的时候他们是刷新/页面加载弹出式窗口，只是模拟像点击：

document.getElementById("LearnMoreBtn").click();

小提琴：http://jsfiddle.net/j4c7U/

来源

2013-12-12 10:48:38 SushiiBalboha

为什么不直接删除display:none; from #overlay and #popup，这会在加载或刷新页面时显示默认弹出窗口。

更新JSfiddle。

来源

2013-12-12 10:50:06 Jonathan

弹出框的页面重载

回答

相关问题