用css+jquery实现视频永远占满全屏效果

用css+jquery实现视频永远占满全屏的效果（电脑端）

css代码核心

object-fit: fill;

jquery代码核心

//高度
var window_hegiht = $(window).height();

setInterval(
    function kk() {
        if (window_hegiht != $(window).height()) {
            window_hegiht = $(window).height();
            $("body").css("height", window_hegiht);
            $("#video_box").css("height", window_hegiht);
        }
        console.log("高度：%d", window_hegiht);
    }, 
1000);

//宽度
var window_width = $(window).width();
setInterval(
    function kk() {
        if (window_width != $(window).width()) {
            window_width = $(window).width();
            $("body").css("width", window_width);
            $("#video_box").css("width", window_width);
        }
        console.log("宽度：%d", window_width);
    }, 
1000);

原理

用css的 object-fit: fill; 使视频永远填满整个屏幕，然后用jquery来不停获取窗口的大小速度可以自己设置。