[BOM]实现页面loading效果，在图片资源加载完之前显示loading

使用到jquery。

判断整个页面是否加载完：

// 这是根据js判断，页面加载完毕就显示
window.onload = function () {
    // console.log('load complete')
    setTimeout(function () {
        $('.container').css({ opacity: '1' })
        $(".loading").hide()
    }, 1000)
}

 

判断某个图片资源是否加载完

// 防止开屏露出色块
var timer = setInterval(function () {
    var img = document.querySelector('.black img')
    if (img.complete) {
        clearInterval(timer);
        $('.rotate').show()
    }
}, 10);