Note that there are some explanatory texts on larger screens.

plurals
  1. POUnexplainable behavior in Chrome, is it my code or theirs?
    primarykey
    data
    text
    <p>I have webpage with a video element nested in a div class="video-container" along with a div class="video-control-bar" which I am using JQuery to animate. I am also using setInterval to query the currentTime of the video element and reflect that in the progress bar contained in the video-control-bar.</p> <p>JavaScript:</p> <pre><code>$(function(){ $(".video-container").each(function(){ player_init($(this)) }) }) function player_init(self) { setInterval(function(){ var video = self.find("video")[0] self.find(".video-control-bar").find(".video-position").find("input").val(video.currentTime / video.duration) self.find(".video-control-bar").find(".video-position").find("progress").val(video.currentTime / video.duration) }, 500) self.hover(function(){ self.find(".video-control-bar").stop().animate({bottom: "0px"}, 25) }, function(){ self.find(".video-control-bar").stop().animate({bottom: "-39px"}, 350) }) } </code></pre> <p>Problem? Well, in Chrome, if I load the page, my setInterval function gets called every 500ms like expected, until I mouse over the player, causing the control-bar animation. After that no further calls are made to my setInterval function.</p> <p><strong>HOWEVER</strong> if I hit refresh, the page reloads and I can mouse over it all I want and everything continues working correctly. But <em>only</em> if I load the page via a refresh.</p> <p>This doesn't happen in Firefox. I suspect it may be a bug in Chrome, as it is similar to a problem I submitted <a href="http://code.google.com/p/chromium/issues/detail?id=95130" rel="nofollow">here</a>.</p> <p>I really have no idea if it's a problem with the way I'm doing things, an issue with JQuery or a bug in Chrome. I really don't care who's bug it is, I just want things to work.</p> <p>Thanks.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload