JavaScript: Ширина и высота html5 видео

Получение ширины и высоты html5 видео в разных состояниях readyState.


<video controls autoplay loop muted playsinline preload="auto" id="sampleVideo">
  <source src="sample.mp4" type="video/mp4">  
  Your browser doesn't support HTML5 video tag
<script src=""></script>
vd = {
	init : function(){		
		var video = document.getElementById('sampleVideo');
		vd.initVideo( video );		
	initVideo : function( video ){	

		HAVE_NOTHING 0 No information is available about the media resource.
		HAVE_METADATA 1 Enough of the media resource has been retrieved that the metadata attributes are initialized. Seeking will no longer raise an exception.
		HAVE_CURRENT_DATA 2 Data is available for the current playback position, but not enough to actually play more than one frame.
		HAVE_FUTURE_DATA 3 Data for the current playback position as well as for at least a little bit of time into the future is available (in other words, at least two frames of video, for example).
		HAVE_ENOUGH_DATA 4 Enough data is available—and the download rate is high enough—that the media can be played through to the end without interruption.
		if( video.readyState == 4 ){ video.videoWidth, video.videoHeight );
		video.addEventListener('loadeddata', function(){
			if( video.readyState  == 0 ){
					video.bind('loadedmetadata', function(){ $(this).videoWidth, $(this).videoHeight );
			} else if( video.readyState  > 0 ){ video.videoWidth, video.videoHeight );
	run : function( w, h ){
		console.log( 'video size:');
		console.log( w, h );


JavaScript up: 3.4 г. просмотров: 1.2k