CODEWITHSUNDEEP
javascriptjqueryslide
Don 1 Desing
Don 1 Desing

Reputation: 11

How to pause a slide in this code?

everybody

I have this code

<script type="text/javascript" >
        $(function(){
            var time = 10000;//milliseconds
            var index = 0;
            var container = $("#containerr");
            var childrenCount = $(".slide").length;
            function slideToNext() {

                index = (index + 1) % childrenCount;
                console.log(index);
                container.css({
                    marginLeft: -1 * index * 100 + "%"
                })
            }

            var pt = window.setInterval(function() {
                slideToNext();
            }, time)
        })
    </script>

I would like to make it pause when mouse over and start play again when the mouse is not over.

how can I make this happen.

Thank you

Upvotes: 0

Views: 22

Answers (1)

TbWill4321
TbWill4321

Reputation: 8666

You need to create a variable to that is set to true when you're hovered:

var isPaused = false;
$("#containerr").on('hover',
    function() { isPaused = true; },
    function() { isPaused = false; }
);

var pt = window.setInterval(function() {
    if ( !isPaused )
        slideToNext();
}, time)

Upvotes: 3

Related Questions