Ram
Ram

Reputation: 91

iPad Touch event not working even though I used some specific codes

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

Answers (1)

user663031
user663031

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

Related Questions