如何将 jQuery SerialScroll 与 mouseover/mouseenter 事件一起使用？

Question

我有一个关于将 SerialScroll 与 click 事件以外的东西一起使用的问题。

看，一旦有人在下一个/上一个“按钮”上，我想激活滚动。我想我应该使用：

event:'mouseenter'

在 SerialScroll 的参数中。

嗯，它开始很好，但它永远不会结束，直到它到达列表的末尾。

所以我尝试绑定 mouseover 事件来触发点击和 mouseleave 以停止滚动... 不幸的是......它没有工作......

任何提示将不胜感激！

代码如下：

     jQuery(".prevline").bind('mouseover',function(){
    jQuery(this).trigger('click');});
  jQuery(".nextline").bind('mouseover',function(){
    jQuery(this).trigger('click');});

  jQuery(".prevline").bind('mouseleave',function(){
    jQuery("#tagline").stop().trigger('stop');});
  jQuery(".nextline").bind('mouseleave',function(){
    jQuery("#tagline").stop().trigger('stop');});

  jQuery('#tagline').serialScroll({
        items:'li', 
        prev:'.prevline',
        next:'.nextline',// Selector to the 'next' button (absolute too)
        axis:'y',// The default is 'y' scroll on both ways
        //navigation:'#navigation li a',
        duration:1000,
        force:true, 

        //queue:false,// We scroll on both axes, scroll both at the same time.
        event:'click',
        stop:true,// Each click will stop any previous animations of the target. (false by default)
        lock:true, // Ignore events if already animating (true by default)        
        //start: 0, 
        //cycle:true,
        //step:1, 
        jump:false,
        //lazy:false,
        //interval:1000,
        //constant:true, 

        onBefore:function( e, elem, $pane, $items, pos ){
            /**
             * 'this' is the triggered element 
             * e is the event object
             * elem is the element we'll be scrolling to
             * $pane is the element being scrolled
             * $items is the items collection at this moment
             * pos is the position of elem in the collection
             * if it returns false, the event will be ignored
             */
             //those arguments with a $ are jqueryfied, elem isn't.
            e.preventDefault();
            if( this.blur )
                this.blur();
        },
        onAfter:function( elem ){
            //'this' is the element being scrolled ($pane) not jqueryfied
        }
    });

Answer 1

只需删除我的所有事件并以其他方式配置插件即可使其工作：

  jQuery('#tagline').serialScroll({
        items:'li',
        prev:'.prevline',
        next:'.nextline',
        axis:'y',// The default is 'y' scroll on both ways
        duration:1200,
        force:true,
        event:'mouseover',
        stop:true,// Each click will stop any previous animations of the target. (false by default)
        lock:true, // Ignore events if already animating (true by default)       
        cycle:false,
        jump:false,
        onBefore:function( e, elem, $pane, $items, pos ){
            e.preventDefault();
            if( this.blur )
                this.blur();
        },
        onAfter:function( elem ){
        }
    });