2013-11-15 20 views
5

Tôi đang xây dựng một caroufredsel cho trang web đáp ứng (chỉ với 3 tiểu bang: 960px, 720px320px). Tính năng này hoạt động tốt khi bạn tải trang ở một trong các trạng thái này. Nó cho thấy số lượng chính xác của các mục (3, 2 và 1 tương ứng). Nhưng, khi bạn thay đổi kích thước cửa sổ, số lượng các mục hiển thị không thay đổi. Tôi đã suy nghĩ về một cuộc gọi $(window).resize(), nhưng tôi không thể tìm thấy cách bạn có thể điều chỉnh cài đặt Caroufredsel sau khi nó được khởi tạo.Các mặt hàng có thể nhìn thấy của Caroufredsel

$('#caroufredsel').carouFredSel({ 
    infinite: true, 
    auto: false, 
    pagination: false, 
    prev: { 
     button: '#prev', 
     key: 'left' 
    }, 
    swipe: { 
     onTouch: true, 
     onMouse: true 
    }, 
    next: { 
     button: '#next', 
     key: 'right' 
    }, 
    items: { 
     visible: 'variable' 
    } 
}); 

Trả lời

4

Những gì bạn cần làm trong resize-callback của bạn như sau:

var $carouselContainer = $('#caroufredsel'); 
var resizeCallback = function() { 
    var showThatManyItems = 3; // determine the number of items to be shown depending on viewport size 
    $carouselContainer.trigger('configuration', [ 
     'items', { 
      visible : showThatManyItems 
     } 
    ], true); 
} 
1

Nếu tôi không nhầm, bạn không cần "đáp ứng: đúng", là một trong các tham số?

Các vấn đề liên quan