Preloading Videos (plus custom preloading screen)

Elements Audio & Video
4

Hi again. So, the project I’m working on (I tried to upload a zip of the mock-up but it’s slightly too big) has multiple layouts as follows:-

230 x 230
290 x 290
480 x 300
650 x 400
815 x 500

Along the lines of the instructions given here I’ve created a ‘preloader.gif’ and made it the same size (815 x 500px) as the largest of the layouts. It resides in the main folder and is referenced in the project’s html file as follows:-

<div id="responsivepreloadertest_hype_container" style="margin:auto;position:relative;width:100%;height:240px;overflow:hidden;">
	<div style="position: absolute; top: 0; left: 0; width: 815px; height: 500px;">
	<img src="./preloader.gif"/>
	</div>
	<script type="text/javascript" charset="utf-8" src="responsivePreloader_test.hyperesources/responsivepreloadertest_hype_generated_script.js?23885"></script>
</div>

The preloader loads fine but obviously doesn’t match the dimensions of any of the layouts.

I’m hoping the fix is just something simple that I’m overlooking due to too many hours spent getting into a frazzle over it all :wink:

Cheers in advance for your time and for any advice :slight_smile: