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 属性优先级低于样式,同时使用样式和属性设置宽高,最后生效的是样式;
参考资料
http://www.w3school.com.cn/tags/av_event_canplay.asp