2014-01-21 72 views
0

我有一個水平滾動輪播:CarouFredSel - 關閉無限滾動?

_gotoNext: function (that) { 

     //tjobbe - put funciton here to check if there is anything else after the last slide, then stop/disable the gotonext. must only scroll one if only one is available (or 2). same for go to prev 
     that.$element.find('.mediaCarousel').trigger("next", false); 
    }, 

    //This method tells the mediaCarousel to go to the previous slide. 
    _gotoPrev: function(that, callback) { 
     that.$element.find('.mediaCarousel').trigger("prev", false); 
    }, 

http://jsfiddle.net/YVCTx/

我需要它來停止或至少禁用下一步按鈕當它到達的最後一個項目。如果有一個非偶數,我也需要它只滾動一個或兩個項目,或讓它完成三個。

我目前的代碼似乎沒有注意內置的「無限:true(或false)」選項。

例如,我現在有7個項目,並且每次滾動3個項目。我想在第三次滾動時停下來,這樣第二次滾動只會和列表中的項目一樣。

任何想法,如果這是可能的?

+0

這是現有的插件還是你創建它嗎? – MrUpsidown

+0

對不起,我沒有看到你提到caroufredsel。 http://docs.dev7studios.com/jquery-plugins/caroufredsel它有'無限'和'圓形'選項。你嘗試過這些嗎? – MrUpsidown

+0

我做了,只是編輯了我的問題 - 對不起。我目前的代碼似乎沒有聽到這個。已經嘗試了無限的真假。 – tjcss

回答

2

似乎有一個圓形和無限的選項,您可以設置。

我會想象其中的一個會做你想要的(最有可能的無限之一):

$('#carousel').carouFredSel({ 
    circular: true,   // Determines whether the carousel should be circular. 
    infinite: true,   // Determines whether the carousel should be infinite. Note: It is possible to create a non-circular, infinite carousel, but it is not possible to create a circular, non-infinite carousel. 
    responsive: false,  // Determines whether the carousel should be responsive. If true, the items will be resized to fill the carousel. 
    direction: "left",  // The direction to scroll the carousel. Possible values: "right", "left", "up" or "down". 
    width: null,   // The width of the carousel. Can be null (width will be calculated), a number, "variable" (automatically resize the carousel when scrolling items with variable widths), "auto" (measure the widest item) or a percentage like "100%" (only applies on horizontal carousels) 
    height: null,   // The height of the carousel. Can be null (width will be calculated), a number, "variable" (automatically resize the carousel when scrolling items with variable heights), "auto" (measure the tallest item) or a percentage like "100%" (only applies on vertical carousels) 
    align: "center",  // Whether and how to align the items inside a fixed width/height. Possible values: "center", "left", "right" or false. 
    padding: null,   // Padding around the carousel (top, right, bottom and left). For example: [10, 20, 30, 40] (top, right, bottom, left) or [0, 50] (top/bottom, left/right). 
    synchronise: null,  // Selector and options for the carousel to synchronise: [string selector, boolean inheritOptions, boolean sameDirection, number deviation] For example: ["#foo2", true, true, 0] 
    cookie: false,   // Determines whether the carousel should start at its last viewed position. The cookie is stored until the browser is closed. Can be a string to set a specific name for the cookie to prevent multiple carousels from using the same cookie. 
    onCreate: null   // Function that will be called after the carousel has been created. Receives a map of all data. 
}); 

來源:documentation

+0

對不起,應該補充說我目前的代碼似乎忽略了無限的真/假。剛編輯我的問題。 – tjcss

+1

你的小提琴似乎只是caroufredsel插件。你可以用一些內容更新它,然後我會看看。 –