Example HTML5 Banner for google dfp

<script type="text/javascript">

function HideFrame() {
  var hideFrame = document.getElementById ("expandedCube");
   hideFrame.style.display="none";
 }

function HideClose() {
  var hideClose = document.getElementById ("expandClose");
   hideClose.style.display="none";
}
 
 function ShowFrame() {
     var showFrame = document.getElementById ("expandedCube");
   showFrame.style.display="block";
 }

 function ShowClose() {
   var showClose = document.getElementById ("expandClose");
    showClose.style.display="block";
 }
</script>
<div id="wrapper" style="positon:relative;">
    <iframe id="normalCube" src="http://gb.yumpuagency.com/htmlexample/step1.html" height="250" width="300" scrolling="no" frameborder="0"></iframe>
    <iframe id="expandedCube" src="http://gb.yumpuagency.com/htmlexample/step2.html" height="600" width="300" scrolling="no" frameborder="0" style="display:none; vertical-align:bottom;" ></iframe>
    <div id="normalClickTag"style="position:absolute; left:0px; top:0px; height:250px; width:300px;" onclick="ShowFrame(), ShowClose()"></div>
    <div id="expandClose" style="position:absolute; left:230px; top:85px; height:15px; width:20px; display:none;" onclick="HideFrame(), HideClose()"> <h3>CLOSE</h3></div>
</div>