1

我正在使用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);
        }

感谢您的帮助

4

1 回答 1

0

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

var slide_timer; // Add variable to component

2:window.setInterval部分移动到自己的函数(startAutoslide)中,并为 slide_timer 赋值,如下所示:

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

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

于 2014-02-03T08:25:47.400 回答