jquery - Jquery - 鼠标悬停时Elastislide停止滑动

Question

我正在使用EASTISLIDE – A RESPONSIVE JQUERY CAROUSEL PLUGIN 该插件在我的网站上完美运行。但是当鼠标悬停时我需要停止滑动

下面是自动播放滑动的代码

// autoplay true || false
autoplay : true,

和

if(this.options.autoplay == true){
            var translation = 0;
            // width/height of an item ( <li> )
            var itemSpace = this.options.orientation === 'horizontal' ? this.$items.outerWidth( true ) : this.$items.outerHeight( true );
            // total width/height of the <ul>
            var totalSpace = this.itemsCount * itemSpace;
            // visible width/height
            var visibleSpace = this.options.orientation === 'horizontal' ? this.$carousel.width() : this.$carousel.height();
            //slide auto
            window.setInterval(function(){
                //test if we should go to next slide or return to first slide
                if(totalSpace > translation + visibleSpace)
                {
                    //go to next slide
                    self._slide('next');
                    //update translation
                    translation += visibleSpace;
                }
                else
                {
                    //return to first slide
                    self._slideTo(0);
                    //set translation to 0
                    translation = 0;
                }
            }, 7000);
        }

感谢您的帮助

Answer 1

1：为定时器添加变量..

var slide_timer; // Add variable to component

2：将window.setInterval部分移动到自己的函数（startAutoslide）中，并为 slide_timer 赋值，如下所示：

slide_timer = window.setInterval(function()...

3：为组件添加onmouseover和onmouseout监听器。在 mouseover 通话clearInterval(slide_timer)和onmouseout通话中startAutoslide。