google-chrome - 强制使用Javascript完整地预加载HTML5视频?

标签 google-chrome html5-video preload

我将尝试以HTML5完全预载视频。我使用属性preload=auto,但它不会预加载整个视频...在Chrome中,视频仅预加载2%,在Safari中预加载大约50%...

是否可以使用javascript强制播放完整的预加载视频?

最佳答案

function addSourceToVideo(element, src, type) {    
    var source = document.createElement('source');    
    source.src = src;    
    source.type = type;    
    element.appendChild(source);    
}

var video;       
$(document).ready(function(){    
    video = document.getElementsByTagName('video')[0];    
    addSourceToVideo( video, "http://your-server.com/clip.ogv", "video/ogv");    
    addSourceToVideo( video, "http://your-server.com/clip.mp4", "video/mp4");    
    video.addEventListener("progress", progressHandler,false);       
});

progressHandler = function(e) {    
    if( video.duration ) {    
        var percent = (video.buffered.end(0)/video.duration) * 100;    
        console.log( percent );    
        if( percent >= 100 ) {    
            console.log("loaded!");    
        }    
        video.currentTime++;    
    }    
}

关于google-chrome - 强制使用Javascript完整地预加载HTML5视频?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16581801/

相关文章:

html - 为什么 Chrome 将这个 HTML 呈现为一个完全空白的页面?来自 Node.js,遵循 The Node Beginner Book

html - 背面可见性禁用表单控件

google-chrome - Chrome 扩展程序 ID - 如何找到它

html - 带有 HTML5 的全屏背景视频

javascript - 如何知道客户端何时改变了播放时间?

jquery - 就性能而言,将图像加载到 JS 图库的最佳实践方法是什么?

android - 如何预加载 Activity ?

javascript - 使用 zuul 调试在浏览器中运行的被测 javascript 代码

javascript - 如何在移动视频时移动 slider

javascript - 图像未正确预加载