wistia-video-background.html

<!--[if lte IE 8]>

  <script>
  var oldIEhasFlash = false;
  try {
      oldIEhasFlash = Boolean(new ActiveXObject('ShockwaveFlash.ShockwaveFlash'));
  } catch(exception) {
      oldIEhasFlash = ('undefined' != typeof navigator.mimeTypes['application/x-shockwave-flash']);
  }
  </script>

<![endif]-->

<script>
     
  
  
  // Youtube Video Background for Unbounce. V1.0
  
  // lpVideoBG('#SectionID', 'wistiaVideoCode', width, height, muted);
  // Use '#lp-pom-root' for a full page video background
  
  if (typeof(oldIEhasFlash) === 'undefined' || oldIEhasFlash === null || oldIEhasFlash === true )
{
   lpVideoBG('#lp-pom-block-10', 'z1ggfo8f86', 560, 315);
}
  
  
 
  function lpVideoBG(pageSectionID, wistiaVideoCode, videoWidth, videoHeight) {
 
    var framedVideoDivID = 'framedVideo-' + pageSectionID.substr(1);
 
    var contentDivID = pageSectionID;
    var videoPosition = 'fixed';
  
    if (pageSectionID != '#lp-pom-root') {  
      contentDivID = pageSectionID + ' .lp-pom-block-content';
      videoPosition = 'absolute';
    }
      
    function resizeVideo() {
    
      var widthOfSection = $(pageSectionID).width(); 
      var heightOfSection = $(pageSectionID).height(); 
      
      if (pageSectionID == '#lp-pom-root') {  
        heightOfSection = $(window).height();
      }
      
      var newRatio = widthOfSection/videoWidth;
   
      //Obtain new height and vertical offset
      var newHeight = videoHeight * newRatio;
    
      //Size up video if less then section height
      if (newHeight <= heightOfSection) {
        var heightRatio = heightOfSection/newHeight;
        newHeight = heightOfSection * heightRatio;
       }
        
      //Adjust width based on new height
      var widthRatio = newHeight/videoHeight;
      var newWidth = videoWidth * widthRatio;
    
      var widthOffset = ((newWidth-widthOfSection) / 2);
      var heightOffset = ((newHeight-heightOfSection) / 2);
    
    
      //Offset and resize video
      $("#" + framedVideoDivID)[0].setAttribute("height", newHeight);
      $("#" + framedVideoDivID)[0].setAttribute("width", newWidth);
      $("#" + framedVideoDivID).css({ top: -heightOffset, left: -widthOffset, position:videoPosition });       
    }
    
    $(contentDivID).css({"width":"100%", "margin-left":"0", "overflow":"hidden"});
    
    $(contentDivID).append('<div style="height:100%;width:100%;position:absolute; top:0px"><iframe id="' + framedVideoDivID + '" src="//fast.wistia.net/embed/iframe/' + wistiaVideoCode + '" allowtransparency="true" frameborder="0" scrolling="no" class="wistia_embed" name="wistia_embed" allowfullscreen mozallowfullscreen webkitallowfullscreen oallowfullscreen msallowfullscreen width="640" height="360"></iframe></div>');
    
    $(contentDivID).append('<div style="height:100%;width:100%;position:absolute; top:0px"></div>');
  
    resizeVideo();
  
    $( window ).resize(function() {
      resizeVideo();
    }); 
  }

</script>