title: Pop up box on page reload
body: <p>hi i just find the code on google and i dont know how to trigger popping a box on load or webpage refresh </p>
  
  <p>HTML </p>
  
  <pre><code>&lt;button id="LearnMoreBtn"&gt;Learn More&lt;/a&gt;
  &lt;div id="overlay"&gt;&lt;/div&gt;
  &lt;div id="popup"&gt;
    Popup contents here
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>#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
  }
  </code></pre>
  
  <p>JAVASCRIPT</p>
  
  <pre><code>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";
     };
  };
  </code></pre>
  
  <p>thanks in advance =)
  heres the demo: 
  <a href="http://jsfiddle.net/j4c7U/" rel="nofollow">http://jsfiddle.net/j4c7U/</a></p>