2012-02-21 15 views
0

私はこのプラグインで同じマウスオーバースクロール効果を作成しようとしています:(矢印の上にマウスを移動してみてください)jQueryのマウスオーバー間隔

http://coffeescripter.com/code/ad-gallery/

私はこのスクリプトを持っている。しかし

$('#leftArrowScroller').bind('mouseover',function() { 
     setInterval(function(){ 
      currentGalleryScroll -= 10; 
      $('#scrollMove').animate({'left':currentGalleryScroll+'px'}); 
     },1); 
    }); 

、このスクリプトは同じ効果を達成しません。それは私がしたいように左にdivをアニメーションが、各間隔の後に一時停止します。リンク内のようにスムーズにスクロールさせる方法に関するアイデアはありますか?ありがとう!

+2

http://www.jsfiddle.net – JIA

答えて

0

は私がいけない

$('#leftArrowScroller').bind('mouseover',function() { 
      setInterval(function(){ 
       currentGalleryScroll -= 10; 
       $('#scrollMove').animate({'left':currentGalleryScroll+'px'},3000); 
      },1); 
     }); 

はあなたがコードのプラグインを見ればのsetInterval

$('#leftArrowScroller').bind('mouseenter',function() {    
      currentGalleryScroll -= 10; 
      $('#scrollMove').animate({'left':currentGalleryScroll+'px'},3000); 

      }); 
+0

あなたはまだ間隔の後にすべて休止することができますか?:( –

+0

なぜあなたはsetInterval関数 – JIA

1

を削除しようとするsetInterval関数が必要だと思うスクロール持続時間を限定してみてください次の関数を使用します。

function() { 
    var direction = 'left'; 
    if($(this).is('.ad-forward')) { 
    direction = 'right'; 
    }; 
    thumbs_scroll_interval = setInterval(
    function() { 
     has_scrolled++; 
     // Don't want to stop the slideshow just because we scrolled a pixel or two 
     if(has_scrolled > 30 && context.settings.slideshow.stop_on_scroll) { 
     context.slideshow.stop(); 
     }; 
     var left = context.thumbs_wrapper.scrollLeft() + 1; 
     if(direction == 'left') { 
     left = context.thumbs_wrapper.scrollLeft() - 1; 
     }; 
     context.thumbs_wrapper.scrollLeft(left); 
    }, 
    10 
); 
    $(this).css('opacity', 1); 
} 

インターバル内に.scrollLeft()プロパティを設定すると、アニメーション化されていることに注意してください。同様のことをしたいかもしれません。

+0

を使っていますか?ありがとう兄貴! –