title: How to get dimensions of dynamically inserted video on ipad? JavaScript
body: <p>I'm dynamically inserting an html5 video tag with unknown dimensions onto a page. I'm getting the dimensions with the <code>loadedmetadata</code> event which works like a charm on all browsers.</p>
  
  <p>However, from what I understand this event won't fire until the user touches the video on the ipad. This makes it really difficult to get the actual dimensions of the video which I need in order to size it's container.</p>
  
  <p>Is there </p>
  
  <ol>
  <li>Another way to get dimensions of a video which would work in this
  scenario? or </li>
  <li>A way to trigger the loadedmetaevent?</li>
  </ol>
  
  <p>Thanks!</p>
  
  <p><strong>CODE</strong>:</p>
  
  <pre><code> var src=fullPathToVideoWithoutExtension;
  
   // DETECT WHICH FILE FORMAT TO USE
   if($.support.browser.h264||$.support.mpeg4){
       var supportedSRC=supportedSRC+'&lt;source src="'+src+'.mp4" type="video/mp4"&gt;';
    };
  
    if($.support.browser.ogg){
       var supportedSRC=supportedSRC+'&lt;source src="'+src+'.ogv" type="video/ogg"&gt;';
    };
  
    // SETUP THE VIDEO ELEMENT
    var $Video=$('&lt;video id="Box_Video" controls&gt;'+supportedSRC+'&lt;/video&gt;');
  
    $Video[0].src=src+'.mp4';
    $Video[0].addEventListener('loadedmetadata',function(){
       var width=this.videoWidth;
           height=this.videoHeight;   
     },false)
  </code></pre>
  
  <p>Here's a fiddle:
  <a href="http://jsfiddle.net/Fv4XG/1/" rel="nofollow">http://jsfiddle.net/Fv4XG/1/</a></p>
  
  <p>Notice that in the browser it will immediately alert the video dimensions, but on the ipad you have to wait until there is user interaction before it pulls the dimensions. How can I get the dimensions when the video is inserted into the DOM like in all other browsers?</p>