javascriptimpress.js

clearTimeout when click anywhere in document


I am using impress.js to make a presentation I have added autoplay successfully but now what i want is whenever someone click's anywhere on the document it should stop

<script>
            ready(function() {
            if (document.getElementById('launched-placeholder'))
            loadPresentation();
            if (!window.presStarted) {
            startPres(document, window);
                var api = impress();
                api.init();
                $(document).on('impress:stepenter', function(e) {
        var currentSlide = $(e.target).attr('id');

        if (currentSlide === 'step-1') {
        setTimeout(api.next, 3000);
        } else if (currentSlide === 'step-2') {
        setTimeout(api.next, 50);
        } else if (currentSlide === 'step-3') {
        setTimeout(api.next, 50);
        } 
</script>

i have tried many things but couldnt get it to work. please help


Solution

  • You should save the reference of setTimeout to be able to clear it:

    var myTim1= setTimeout(api.next, 3000);
    

    and not

     setTimeout(api.next, 3000);
    

    then

    clearTimeout(myTim1);
    

    On Doc Click Event:

    document.onclick=function(){
      clearTimeout(myTim1);
    
    };
    

    Or using jQuery:

     $(document).click(function(){
          clearTimeout(myTim1);
    
        });