[Solved] how can i do the following on my website? [closed]

by


try this but im not sure it works.
JSFiddle – link

EDIT:
Html

<body>
  <div id="box">
     <a href="https://stackoverflow.com/questions/23628933/javascript:show();" >Link</a>
  </div>
  <div id="box2">    
     <iframe src="" id="frame" width=100% height=100%></iframe>
     <div id="close"><input type="button" onclick="closeIframe()" value="X" /></div>
  </div>
</body>

Javascript

function show()
{
  box= document.getElementById("box");
  box.style.visibility="hidden";

  frame=document.getElementById("box2");
  frame.style.visibility="visible"; 
}
function closeIframe()
{
  box2=document.getElementById("box2");
  box2.style.visibility="hidden";
  box= document.getElementById("box");
  box.style.visibility="visible";
}

CSS

#box
{  
   background-color:yellow;
}
#box2
{
   position:absolute;
   top:7px; //here i've set 7px but you cant set what you want 
   visibility:hidden;
}
#close
{
   position:relative;
   left:100%;
   width:50px;
   top:-160px;
 }

21

solved how can i do the following on my website? [closed]