title: Unexplainable behavior in Chrome, is it my code or theirs?
body: <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>