根据教程创建了一个迷你交互式视频模块,但奇怪的是,该代码适用于 Chrome,但不适用于 firefox 或 Waterfox .. 任何人都可以找出问题所在吗?
在这个项目中,视频会在几个特定的时间间隔内暂停和恢复,以等待用户输入。暂停和恢复适用于 Chrome,但 Firefox 似乎没有注册任何内容。
此外,在开发过程中,当它确实工作时,timeupdate 在 Firefox 上以不同的时间间隔暂停视频,而不是在 chrome 上。
// Various variables
var videoHalfWay = 0;
var formattedHalfWay = 0;
// Choice parts
var choiceHeart = 2;
var partnerPart = 56;
var partnerChosen = false;
var badChoicePart = 15; // Modified
var ending = 20; // ADDED
var goodChoiceChosen = false;
var choiceHeartchosen = false;
var qualityChosen = false;
var costChosen = false;
var qualityQuestion = 30;
var costPart = 38;
var costCons = 36;
// Question variable
var question1Asked = false;
var video1;
$(document).ready(function(){
$.featherlight.defaults.afterClose = playPauseVideo;
video1 = $('#video1');
$('.box1').on('click', function(){
choiceHeartchosen = true;
video1[0].play();
});
$('.box2').on('click', function(){
partnerChosen = true;
video1[0].currentTime = partnerPart;
video1[0].play();
});
$('.box3').on('click', function(){ //quality
costChosen = true;
video1[0].currentTime = costPart;
video1[0].play();
});
$('.box4').on('click', function(){ //cost
qualityChosen = true;
video1[0].play();
});
$(video1).on('loadeddata', function(){
videoHalfWay = Math.round(this.duration/2);
})
$(video1).on('timeupdate', function(){
console.log(this.currentTime);
var currentTime = Math.round(this.currentTime*100)/100;
console.log(currentTime);
var durationNum = Math.round(this.duration*100)/100;
var formattedCurrentTime = secondsToHms(currentTime);
var formattedDurationTime = secondsToHms(durationNum)
onTrackedVideoFram(formattedCurrentTime, formattedDurationTime)
if(currentTime >2){ $(".box1, .box2").hide(); }
if(currentTime <20){ $(".box4").hide(); }
if(currentTime <22){ $(".box3").hide(); }
if(currentTime >20){ $(".box4").show(); }
if(currentTime >21){ $(".box3").show(); }
if(currentTime >30){ $(".box3, .box4").hide(); }
if(currentTime == costCons && costChosen == true){ video1[0].pause(); }
if(currentTime == choiceHeart && choiceHeartchosen == false){
video1[0].pause();
}
if(currentTime == costCons && costChosen == false){
video1[0].pause(); //Pauses for Cost Consequence
}
if(currentTime == qualityQuestion && qualityChosen == false){
video1[0].pause(); //Pauses the video at 30
}
if(currentTime == qualityQuestion && costChosen == true){
video1[0].play(); //Plays Consequence for Cost Effective choice
}
if(currentTime == videoHalfWay){
// Halfway point
}
if(currentTime == durationNum){
// Video complete
}
});
});
function onTrackedVideoFram(curretTime, duration){
$('.current').text(curretTime);
$('.duration').text(duration);
}
function secondsToHms(d) {
d = Number(d);
var h = Math.floor(d / 3600);
var m = Math.floor(d % 3600 / 60);
var s = Math.floor(d % 3600 % 60);
return ((h > 0 ? h + ":" + (m < 10 ? "0" : "") : "") + m + ":" + (s < 10 ? "0" : "") + s);
}
function playPauseVideo(popUp){
if(video1[0].paused){
video1[0].play();
} else{
video1[0].pause();
$.featherlight($(popUp));
}
}
这是整个项目的链接: https ://www.dropbox.com/s/ssxvrvrfwu5izss/Webmodule.rar?dl=0
如果有人可以在这里或一对一帮助我,将不胜感激。