Skip to content

Instantly share code, notes, and snippets.

@jesuscast
Created October 7, 2015 03:25
Show Gist options
  • Save jesuscast/507549df695d451bcab7 to your computer and use it in GitHub Desktop.
Save jesuscast/507549df695d451bcab7 to your computer and use it in GitHub Desktop.
<video autoplay="" loop="" poster="img/cover-background.png" id="bgvid" class="stretchToFit" style="">
<source src="http://executive.inncubator.net/wp-content/uploads/2015/10/video21.mp4" type="video/mp4">
<source src="http://executive.inncubator.net/wp-content/uploads/2015/10/video2.webm" type="video/webm">
</video>
<img class="ls-l ls-preloaded" id="image-in-header" style="top: 266.5px; left: 680.5px; white-space: nowrap; width: 479px; height: 67px; padding: 0px; border-width: 0px; visibility: visible; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1;" data-ls="offsetxin:0;durationin:2500;offsetxout:0;" src="http://www.inncubator.net/wp-content/uploads/2015/04/tag.png" data-src="http://www.inncubator.net/wp-content/uploads/2015/04/tag.png" alt="">
<p id="button-in-header" class="ls-l" style="top: 369px; left: 825px; white-space: nowrap; width: 100px; height: auto; font-size: 13px; padding: 0px; border-width: 0px; visibility: visible; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1;" data-ls="offsetxin:0;durationin:5000;offsetxout:0;">
<a class="smooth" href="#menu_150" title="Enter"><img src="http://inncubator.net/wp-content/uploads/2015/04/left.png" class="ls-preloaded">
</a>
</p>
<style type="text/css">
body {
overflow-x: hidden;
}
video#bgvid {
width: 101%;
background-image: url('img/cover-background.png');
background-size: cover;
margin-left: -7.5px;
margin-top: -36px;
}
.scroll-to-explore {
background-color: rgba(6, 6, 6, 0.43);
height: 48px;
padding: 0px 20px 0px 20px;
}
#image-in-header {
position: absolute;
}
#button-in-header {
position: absolute;
}
</style>
<script type="text/javascript">
document.getElementById("bgvid").parentNode.parentNode.parentNode.parentNode.parentNode.style.width = "100%";
var image_in_header = document.getElementById("image-in-header");
var button_in_header = document.getElementById("button-in-header");
a1 = image_in_header.clientHeight;
a2 = button_in_header.clientHeight;
hh = window.innerHeight;
b1 = image_in_header.clientWidth;
b2 = button_in_header.clientWidth;
ww = document.body.clientWidth;
image_in_header.style.top = (parseInt(hh/2)-parseInt(a1/2)).toString()+"px";
button_in_header.style.top = (parseInt(hh/2)+parseInt(a1/2)+20).toString()+"px";
image_in_header.style.left = (parseInt(ww/2)-parseInt(b1/2)).toString()+"px";
button_in_header = (parseInt(ww/2)-parseInt(b2/2)).toString()+"px";
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment