javascriptjqueryhtml5-video

HTML5 Video Dimensions


I'm trying to get the dimensions of a video of which I'm overlaying onto a page with JavaScript, however it is returning the dimensions of the poster image instead of the actual video as it seems it's being calculated before the video is loaded.


Solution

  • <video id="foo" src="foo.mp4"></video>
    
    var vid = document.getElementById("foo");
    vid.videoHeight; // returns the intrinsic height of the video
    vid.videoWidth; // returns the intrinsic width of the video
    

    Spec: https://html.spec.whatwg.org/multipage/embedded-content.html#the-video-element