FANDOM


Pop Up

HHML

<body onLoad="xpopup()"; "ypopup()";>

<a href="#" class="listAttractions" id="x">Link 1</a>
<a href="#" class="listAttractions" id="y">Link 2</a>

JAVASCRIPT

function xpopup() {

       document.getElementById("x").onclick= function(){
           var overlay = document.getElementById("overLay");
           var popup = document.getElementById("xPopup");
           overlay.style.display = "block";
           popup.style.display = "block";
       }
   }
   function ypopup() {
       document.getElementById("y").onclick= function(){
           var overlay = document.getElementById("overLay");
           var popup = document.getElementById("yPopup");
           overlay.style.display = "block";
           popup1.style.display = "block";
       }
   }
   </script>
CSS

.popupBox{ display:none; position: fixed; width: 30%; height: 40%; margin-left: 16.5%; margin-top: 4.5%; background-color: white; border: 2px solid black; border-radius: 10px; z-index: 10; }

  1. overLay{

display:none; position: fixed; width: 100%; height: 100%; background-color: #707070; opacity: 0.7; z-index: 9; left: 0; top: 0; }

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.