title: flash mp4 playback with videojs in firefox - audio plays but video is blank
body: <p>So I'm using videojs to render some mp4s coming in from instagram dynamically. I'm using this function to call the player, and it works great until it comes to firefox:</p>
  
  <pre><code>      // o is the jquery object for the video
        var vid_obj = o.find('video')
          var vid_id = vid_obj[0].id
          settings = vid_obj.attr('data-settings')
  
          if (settings) settings = $.parseJSON(settings)
  
          if (vid_id) {
              settings.height = vid_obj.height()
              videojs.options.flash.swf = "/scripts/vendor/video.js/video-js.swf"
              videojs(vid_id, settings)
          }
  </code></pre>
  
  <p>When I run the script in Chrome or any other browser with native mp4 support it loads fine, even if i specify flash as the default for tech order. In firefox, the audio plays but the video is blank.</p>
  
  <p><img src="https://f.cloud.github.com/assets/4459634/1632561/0ccdb780-577a-11e3-92b5-9be48960546d.png" alt="screen shot 2013-11-27 at 9 31 53 am"></p>
  
  <p>In addition, I'm getting these errors from firefox:</p>
  
  <blockquote>
    <p>Specified "type" attribute of "video/mp4" is not supported. Load of media resource <a href="http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4" rel="nofollow noreferrer">http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4</a> failed.
    All candidate resources failed to load. Media load paused.
    Specified "type" attribute of "video/mp4" is not supported. Load of media resource <a href="http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4" rel="nofollow noreferrer">http://distilleryimage6.s3.amazonaws.com/6ccd80e8561211e38d000a4507324e8b_101.mp4</a> failed.
    All candidate resources failed to load. Media load paused.</p>
  </blockquote>
  
  <p>I dug around a bit on stackoverflow and found this thread: <a href="https://stackoverflow.com/questions/17644444/issue-with-the-flash-fallback-of-videojs-how-to-make-it-work">Issue with the flash fallback of VideoJs with Firefox</a></p>
  
  <p>Also, this interesting point</p>
  
  <blockquote>
    <p>I did run into an issue on Firefox where the Flash fallback would play the video but the video would be blank (audio would play) when I included a "ready" event. I was able to get around this by firing a blur event on the $(this) object. That may be helpful to you if you need to use ready.</p>
  </blockquote>
  
  <p>I tried adding the <code>.ready()</code> callback with the <code>$(this).blur()</code>  with no success. Any suggestions? </p>