Obtenga el ancho y el alto de video HTML5 usando JavaScript nativo
Estoy tratando de obtener el ancho y el alto de la etiqueta, estoy usando el siguiente marcado:
<div class="masked" id="video_container">
<video id="video" loop="loop" muted="muted" tabindex="0" style="width: 100%; height: 100%;">
<source src="..." type="..."</source>
<source src="..." type="..."</source>
</video>
</div>
La parte clave es que los atributos de ancho y alto se configuran al 100%, y cuando se cambia la ventana, se guarda la relación de aspecto del video, pero no puedo obtener el ancho y el alto reales.
Intenté obtener valor utilizando las propiedades offsetWidth y offsetHeight, pero son el tamaño real de retorno del video.
Editar:
Esta es la pieza de código que me funciona:
var videoActualWidth = video.getBoundingClientRect().width;
var videoActualHeight = video.getBoundingClientRect().height;
var aspect = videoActualWidth / videoActualHeight;
if (w / h > aspect) {
video.setAttribute("style", "height: 100%");
} else {
video.setAttribute("style", "width: 100%");
}
¡Gracias!