检测寻找视频事件HTML5(主要在iOs4上)

时间:2012-05-21 13:08:04

标签: javascript javascript-events ios4 html5-video

我需要检测seeking事件,因为在iOs4上有寻求但没有寻找事件。 我不想检测设备而是功能。

我可以制作一个糟糕的addEvent / fireEvent,但我正在寻找像'seeking' in myElement一样性感的东西。

任何解决方案? 谢谢!

2 个答案:

答案 0 :(得分:1)

var lastUnixTimeStamp;
var lastCurrentVideoTime;

videoplayer.addEvent('timeupdate',function(){

    if( !lastUnixTimeStamp && !lastCurrentVideoTime ){  //not defined at first timeupdate event
         lastUnixTimeStamp = new Date().getTime();
         lastCurrentVideoTime = videoplayer.currentTime;
         return;
    }

    var videoTimeOffset = videoplayer.currentTime - lastCurrentVideoTime;  //how many milliseconds was video running
    var realTimeOffset = new Date().getTime() - lastUnixTimeStamp;  //how many milliseconds were real time running

    //guess the numbers are not accurate, so if the difference between both is f.e. < 100ms, video runs normally 
   if( (videoTimeOffset - realTimeOffset) > 100 ){
       //do your seeking magic
   }

    lastUnixTimeStamp = new Date().getTime();
    lastCurrentVideoTime = videoplayer.currentTime;


})

如上面的评论所述,可能不是最好的解决方案,但应该这样做。祝你好运

答案 1 :(得分:0)

此解决方案仅在您寻求前进时才有效。如果您希望它在向后搜索时工作,则必须验证videoTimeOffset是否为负数:

var lastUnixTimeStamp;
var lastCurrentVideoTime;

videoplayer.addEvent('timeupdate',function(){

if( !lastUnixTimeStamp && !lastCurrentVideoTime ){  //not defined at first timeupdate event
     lastUnixTimeStamp = new Date().getTime();
     lastCurrentVideoTime = videoplayer.currentTime;
     return;
}

var videoTimeOffset = videoplayer.currentTime - lastCurrentVideoTime;  //how many milliseconds was video running
var realTimeOffset = new Date().getTime() - lastUnixTimeStamp;  //how many milliseconds were real time running

//guess the numbers are not accurate, so if the difference between both is f.e. < 100ms, video runs normally 
if( (videoTimeOffset - realTimeOffset) > 100 || (videoTimeOffset < 0 )){
   //do your seeking magic
}

lastUnixTimeStamp = new Date().getTime();
lastCurrentVideoTime = videoplayer.currentTime;


})