TheBnl 0 Report post Posted May 28, 2012 (edited) Hey! I'm working on an custom map, i have the map from google and altert the style it all works.But i would like to show a HTML5 movie in an overlapping div and then fade it out afer it is finished.This is what i got so far: Jquery: <script type="text/javascript">$('#soundlogo').delay(400).fadeOut(400);</script> CSS: #soundlogo { height:100%;width:100%;display:block; background-color:#FFF;position:fixed;z-index:100;} body: <body onload="initialize()"> <div id="soundlogo"> <video width="100%" autoplay> <source src="video/soundlogo-web.mp4" type="video/mp4" /> Your browser does not support the video tag.</video> </div><div id="nav"><strong>Mode of Travel: </strong><select id="mode" onchange="calcRoute();"> <option value="DRIVING">Driving</option> <option value="WALKING">Walking</option> <option value="BICYCLING">Bicycling</option></select></div> <div id="map_canvas" style="width:100%; height:100%"></div> </body> Problem is that the fade never occurs,thanks in advance! Edited May 28, 2012 by TheB Quote Share this post Link to post Share on other sites
TheBnl 0 Report post Posted May 28, 2012 I solved it by wrapping the animation in a .ready function: $(document).ready(function(){$('#soundlogo').delay(1900).fadeOut(400);}); Quote Share this post Link to post Share on other sites
