JS代码
var video = document.querySelector('video');
video.addEventListener('canplay', function () {
this.width = this.videoWidth;
this.height = this.videoHeight;
});
知识点
- canplay 事件，视频达到可以播放时触发；
- videoWidth 和 videoHeight 属性为视频真实宽高，这两个属性为只读属性，赋值不会生效；
- width 和 height 属性为视频在页面上显示的尺寸，可以在元素设置或JS赋值；
- width 和 height 属性优先级低于样式，同时使用样式和属性设置宽高，最后生效的是样式；
参考资料