carouFredSel - ustawić widoczną ilość do rzeczywistej ilości obrazów - i nadal przewijać?

Question

pracuję z tego zmieniacza

http://coolcarousels.frebsite.nl/c/2/

mam tej konfiguracji poniżej.

Mój problem to Mam ustawiony na visible: 4 i mam 4 obrazy, więc nie przewija. Jeśli ustawię go na visible: 3, to działa zgodnie z oczekiwaniami. Ale chcę wyświetlić wszystkie 4 obrazy na jednym ekranie po otwarciu pełnej szerokości przeglądarki w rozdzielczości 1920 pikseli. Problem wydaje się. Jeśli ustawię widoczność na ilość obrazów, które mam wtedy przestaje działać.

Czy istnieje sposób, aby mieć jednocześnie wszystkie 4 obrazy na ekranie, a następnie nadal je przewijać?

$(function() { 
    $('#carousel').carouFredSel({ 

     width: '100%', 
     align: 'left', 

     items: { 
      visible: 4, 
      start: 0, 


     }, 
     scroll: { 
      items: 1, 
      queue   : true, 
      fx: "scroll", 
      easing: "swing", 
      duration: 1000, 
      timeoutDuration: 3000 
     }, 

     prev: '.prev', 
     next: '.next', 


     auto: { 
      easing: "quadratic", 
      button: '.play', 

      pauseOnEvent: 'resume', 
       pauseOnHover: true 
     } 

    }).find(".slide .plusNav").hover(
       function() { $(this).find("div").slideDown(); }, 
       function() { $(this).find("div").slideUp(); } 
    ); 
}); 

Answer 1

udało mi się to zrobić poprzez edycję źródło:/

Jeśli skomentować tę linie 554 & 556 w jquery.carouFredSel-6.2.0.js tak ...

// not enough items 
var minimum = (is_number(opts.items.minimum)) ? opts.items.minimum : opts.items.visible + 1; 
if (minimum > itms.total) 
{ 
    // e.stopImmediatePropagation(); 
    // return debug(conf, 'Not enough items ('+itms.total+' total, '+minimum+' needed): Not scrolling.'); 
} 

... to zadziałało dla mnie.

Answer 2

spróbować tej

items: { 
    minimum: 0, 
}, 

Answer 3

uzyskać dostęp do opakowania i ustawić jego wysokość (zakładając, że wszystkie dzieci mają taką samą wysokość):

var carousel = [your_carousel], 
    carousel_wrapper = carousel.parent(); 

carousel_wrapper.height(function(){ 
    return (carousel.children('[child_selector]').length) * [child_height]; 
}); 

Chodzi o to, że będzie dziwne zachowanie, gdy animowana jest karuzela. To dlatego, że maksymalna wysokość przeprowadzono ((n-1) * child_height) celowo, jako maska, a także z przelewem : ukryty.

Inną opcją jest powielenie jednego z dzieci, ale to nie jest semantyczne.

Answer 4

mam rozwiązać ten problem przez ustawienie minimum 0.

items: { 
    minimum: 0, 

Właściwie ustawienie atrybutu minimum zero wymusza paska przewijania mają być wyświetlane zawsze, niezależnie od liczby pozycji aktualnie wyświetlanych.

Było to wymagane, ponieważ automatyczne włączanie pasków przewijania nie działało w niektórych rozdzielczościach ekranu - musiałem dodać 2 dodatkowe elementy, aby pasek przewijania był widoczny, co nie było oczekiwanym zachowaniem.

Jako pracy wokół ustawić minimum: 0 - to rozwiązało problem.