Question

我想拒绝在我的网页上预加载我的视频。我试图实现HTML5标签“Preload：”none“”但我不能这样做，因为我在Wordpress中使用了一个Videoslider。在我的网站www.motivfilm.de上，你可以看到标题视频加载得非常好，我在其中插入了带有HTML5视频标签的manuelly。但页面无法停止加载，因为视频滑块未完全加载。这就是我在搜索Header视频时应该加载一个脚本来取消加载Videoslider的原因。我希望只有当您点击播放视频时才会加载视频滑块。我的问题有解决方案吗？我试图从视频滑块中删除SRC，并在单击播放时将SRC置于其中，但在大多数浏览器中都没有。

我的执行脚本看起来像这样。

<script type="text/javascript">
//load background images first
jQuery( document ).ready(function($) {

$('body').waitForImages({
    waitForAll: true,
    finished: function() {
       // All images have loaded.
    }  
});
</script>

<script type="text/javascript">
//check mobile devices
function isMobile(){
    return navigator.userAgent.match(/(iPhone|iPod|iPad|blackberry|android|Kindle|htc|lg|midp|mmp|mobile|nokia|opera mini|palm|pocket|psp|sgh|smartphone|symbian|treo mini|Playstation Portable|SonyEricsson|Samsung|MobileExplorer|PalmSource|Benq|Windows Phone|Windows Mobile|IEMobile|Windows CE|Nintendo Wii)/i);
}
if(isMobile()){


}else {
   // stop video when scrolling down
var videos = document.getElementsByTagName("deny"),
fraction = 0.8;
function checkScroll() {

    

        var video = deny;

        var x = video.offsetLeft, y = video.offsetTop, w = video.offsetWidth, h = video.offsetHeight, r = x + w, //right
            b = y + h, //bottom
            visibleX, visibleY, visible;

            visibleX = Math.max(0, Math.min(w, window.pageXOffset + window.innerWidth - x, r - window.pageXOffset));
            visibleY = Math.max(0, Math.min(h, window.pageYOffset + window.innerHeight - y, b - window.pageYOffset));

            visible = visibleX * visibleY / (w * h);

            if (visible > fraction) {
                video.play();
            } else {
                video.pause();
            }

    

}

window.addEventListener('scroll', checkScroll, false);
window.addEventListener('resize', checkScroll, false)
}
</script>
 
<html>
    <video class="deny" id="deny" poster="wp-content/uploads/2016/02/LoadingGif.gif" width="100%" height="100%" autoplay loop="loop" preload="none" autobuffer>
        <source src="wp-content/uploads/2016/02/ShortReel20.16_Mute.mp4" type="video/mp4">
</video>

</html>

请帮帮我！谢谢

Javascript deny视频加载

0 个答案: