Reputation: 91
I am working on an epub so i have a task like when I click on the text it will be zoomed and at the same time it will play the audio. The code works fine in Safari browser:
$(document).ready(function() {
var $ = jQuery.noConflict();
<!-- document.addEventListener("touchstart", function(){}, true); -->
var ua = navigator.userAgent, event = (ua.match(/iPad/i)) ? "touchstart" : "click";
$('.cls_txt').bind(event, function(e) {
document.getElementById('track').play();
document.getElementById('track').addEventListener('timeupdate', function (){
var original=this.currentTime;
var ct=Math.round(original*10)/10;
console.log(ct);
if(ct>=0.1 && ct<=0.3){ $('#t1').addClass('sss'); }
if(ct>0.4){ $('#t1').removeClass('sss'); }
},false);
});
});
but the above code works in some other pages. Help me.
Upvotes: 0
Views: 293
Reputation:
What doesn't work? Does the audio play, but no zooming?
At first glance, the this.currentTime
is not going to work--on the iPad or any browser--since this
is not defined in the context of the event handler. You need to remember the video outside, as in:
var track = document.getElementById('track');
track.play();
track.addEventListener('timeupdate', function (){
var original=track.currentTime;
Upvotes: 0