safeframe/examples/IAB_RisingStars/AdFiles/pushdownAdContent.html

SafeFrame provides a consistent JS API to include 3rd party content

<!-- 
THIS IS EMBEDDED AS scripted content .
Source here is provided as a mechanism to make the ad more readable.
Actual source is translated into Javascript string and placed in "pushdownAdBootstrap.js" file.
-->
<style>
#collapsedAd{
 display: none;
 cursor: pointer;
 width:970px;
 height: 90px;
}


#expandedAd{
 display: none;
 cursor: pointer;
 width:970px;
 height: 415px;
}

#adTeaser{
  height : 70px;
 font-weight:bold;
 font-size:0.7em;
}

#adButton{
  float : right;
 color: #888;
 font-weight:bold;
 font-size:0.8em;
 font-family: Verdana;
 text-align: right;
 cursor: pointer;
 text-decoration: underline;
}


#adLogo{
 max-width: 239;
  width: 239;
  height : 68px;
}

#primaryApp{
  float : left;
  width : 543px;
  height : 307px;
}

#secondaryApp{
  float : right;
  width : 367px;
  height : 307px;
}

.mockContent{
  position : relative;
  background-color : #A6240F;
  padding : 10px;
 font-family: Verdana;
}

.mockContent > div, .mockContent > h1, .mockContent > p {
}
</style>

<script>
function preCollapse(){
 collapseAd();
}

window.adExpandedDim = {l:0, r:970, t:0, b:415, h:415, w:970, push:true};
window.adCollapsedDim = {h:90,w:970};
</script>

<div id="collapsedAd" onclick="expandAd()" style="display: none;">
 <!-- Pushdown Teaser -->
 <div id="adTeaser" class="mockContent">
   <h1>Teaser</h1>
  <span id="adButton">Expand
   <img src="https://s3-us-west-2.amazonaws.com/safeframe/examples/IAB_RisingStars/AdFiles/downarrow.png">
  </span>
 </div>
</div>

<div id="expandedAd" onclick="collapseAd()" style="display: block;">
 <!-- Expanded View -->
 <!-- Divs
 <div id="adLogo" class="mockContent" style="max-width: 239px;">
  Logo
 </div>

 <div>
  <div id="primaryApp" class="mockContent">
  Primary App
  </div>

  <div id="secondaryApp" class="mockContent">
  Secondary App
  </div>
 </div>-->
 <img src="https://s3-us-west-2.amazonaws.com/safeframe/examples/IAB_RisingStars/AdFiles/pushdown_expanded_ad.png">
</div>

<script src="https://s3-us-west-2.amazonaws.com/safeframe/examples/IAB_RisingStars/AdFiles/adScriptBehavior.js"></script>