Alexis Boulet Posted November 24, 2018 Share Posted November 24, 2018 Hi, I'm the admin of the site https://fenetresboulet.com/. It was conceived by a firm that I don't to do business with anymore. They put a Vimeo video under a png overlay on top of the first page. Because it's a Vimeo link, the video is taking too long to load and image quality is not optimal. I want to change the src of the var myvideo for a mp4 video file that I upload in /video/siteweb.mp4 I found that in index.tpl: $(function(){ var windowH = $(window).height(); var wrapperH = $('.overlayvideo').height(); if(windowH > wrapperH) { $('.overlayvideo').css({'height':($(window).height())+'px'}); } $(window).resize(function(){ var windowH = $(window).height(); var wrapperH = $('.overlayvideo').height(); var differenceH = windowH - wrapperH; var newH = wrapperH + differenceH; var truecontentH = $('#myvideo').height(); if(windowH > truecontentH) { $('.overlayvideo').css('height', (newH)+'px'); } resizer(); }) }); $(function(){ var windowH = $(window).height(); var wrapperH = $('.overlay').height(); if(windowH > wrapperH) { $('.overlay').css({'height':($(window).height())+'px'}); } $(window).resize(function(){ var windowH = $(window).height(); var wrapperH = $('.overlay').height(); var differenceH = windowH - wrapperH; var newH = wrapperH + differenceH; var truecontentH = $('#myvideo').height(); if(windowH > truecontentH) { $('.overlayvideo').css('height', (newH)+'px'); } resizer(); }) }); var container = document.getElementById('overlayvideo'); var video = document.getElementById('myvideo'); var ratio = 54/96; //this is why the 56.25% padding hack exists function resizer() { var width = parseInt(window.getComputedStyle(container)['width'], 10); var height = (width * ratio); video.style.width = width + 'px'; video.style.height = height + 'px'; video.style.marginTop = '0'; //~732px wide, the video border is about 24px thick (24/732) container.style.height = (height * 1) + 'px'; //0.88 was the magic number that you needed to shrink the height of the outer container with. } and this source code from chrome: <div id="videocontainer" class="videocontainer"><div id="overlayvideo" class="overlayvideo" ><div class="overlay"><div class="godown"> <a href="#page"><div class="icon"></div></a></div></div><div id="myvideo"> <iframe src="https://player.vimeo.com/video/132442378?autoplay=1&loop=1&automute=1" width="100%" height="1070px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> I have no idea of what I need to change... Thanks. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now