2013-05-26 14 views
0

我試圖使用jQuery jCarousel作爲圖像瀏覽器。它工作正常,但我想更改交互,以便在mousedown上連續滾動,而不是單擊滾動設置的數量。jQuery滾動監聽器的mousedown(對於jCarousel)

很明顯,我是一個使用jQuery的完全新手,但我最初認爲我可以使用jCarousel配置事件選項來觸發mousedown上的控件。這工作,但不會繼續滾動。

我想我需要一個偵聽器來查看鼠標是否仍然關閉,對不對?我發現在計算器上this的解決方案,我試圖適用於:jsfiddle.net/amenity/BSq85/19

jQuery(document).ready(function() { 
    $('.jcarousel').jcarousel({ 
     wrap: 'circular', 
     animation: 1500, 
     easing: 'linear' 
    }); 

    var timeout, clicker = $('.jcarousel-prev'); 
    var count = 0; 

    clicker.mousedown(function() { 
     timeout = setInterval(function() { 
      $('.jcarousel-prev').jcarouselControl({ 
       target: '-=2' 
      }); 
     }, 500); 

     return false; 
    }); 

    $(document).mouseup(function() { 
     clearInterval(timeout); 
     return false; 
    }); 

    $('.jcarousel-next').jcarouselControl({ 
     target: '+=2', 
      'event': 'mousedown' 
    }); 


}); 

我離開(右)下一個按鈕上點擊移動比較到運行的外部控制。

回答

0

沒有任何人把我從新手深淵拉出來,我掙扎着直到我去做點什麼。 This answer看起來非常接近我所需要的,我以此爲出發點。現在我至少得到了here

最關鍵的是,我懷疑,創建一個定時器,以再次調用該函數如果鼠標仍然向下,並清除它的mouseup:

var _this = null; 
    $('.jcarousel-next').mousedown(function() { 
     $('.jcarousel-next').jcarouselControl({ 
       target: '+=2' 
     }); 
     _this = $(this); 
     _this.click(); 
     window.setTimeout(CallAgain, 100); 
    }); 

    $('.jcarousel-next').mouseup(function() { 
      _this = null; 
     }); 

    function CallAgain() { 
     if (_this != null) { 
      //alert("Inside Call again"); 
      _this.click(); 
      window.setTimeout(CallAgain, 100); 
     } 
    }; 

在小提琴,右箭頭對滾動mousedown,而left/prev保留默認值。現在我只需要平滑它。

+0

對於後代的緣故:以平滑的滾動中,我使用的jQuery(文件)。就緒(函數(){ $( '的jCarousel。')的jCarousel({ 渦卷: '循環', '動畫': { 'duration':1500, 'easing':'linear' } }); – Beatrice