javascript - $(document).ready or window.onload for hiding/showing a video -
i'm running script (hack) trick safari correctly sizing video on responsive page. script below waits moment hides, , shows video, causing safari realize should expand video proper size.
i'm worried $(document).ready
may fire script (i.e., before video loaded), causing script not supposed video. possible $(document).ready
script may fire since video isn't loaded after set milliseconds video not hidden/shown?
should use window.onload
(or method?) instead ensure hide/show sizing hack works?
in tests, script works, on reloads when clear cache. few times when i've loaded page on random computers video not size correctly until reload page. using window.onload
seems less ideal in user may notice incorrectly sized video while page content loading, or see hack in action after does.
<script><!-- super hack toggle display block/none tricks safari sizing video--> $(document).ready(function() { $("#video1").delay(3000).hide(0, function() { $("#video1").delay(3500).show(); }); }); </script>
here difference between 2 events:
window.onload
fired after content (i.e. media , stylesheets) have been loaded. dom event$(document).ready()
fired after html document has loaded (i.e last closing tag has been loaded, media , stylesheets may not have loaded yet). event technically unique jquery but, if aailiabe, jquery usesdomcontentloaded
dom event.
however, jquery have event fires after media has loaded, $(document).load()
, deprecated since 1.8
if want code run before video has loaded, use $(document).ready()
if want code run after video has loaded, use window.onload
or $(document).load()
to answer comment:
provided video has loaded time delay have finished (totals
7.5 seconds
), hack work.even if video has not loaded, html element still exists, can hidden , shown before video has loaded (though not sure if hack still work, depends on how , when safari decides size of video).
obviously if video hasn't loaded, hiding , showing not alter visually, since element empty / has no content.
Comments
Post a Comment