Wiele karuzel (carouFredSel) za pomocą jquery each, identyfikator identyfikatora linku

Question

Korzystam z poniższego kodu, aby utworzyć wiele slajdów na 1 stronie.

Pokazy slajdów działają dobrze, ale nie mogę uruchomić poszczególnych przycisków każdego pokazu slajdów. Kiedy klikam, strona przewija się na samą górę. Pomyślałem przez jednoznaczne zidentyfikowanie każdego linku, w którym nie powinienem mieć problemu.

Jakieś pomysły, co jest nie tak?

 $("div.slideshow").each(function(){ 
      $(this).find('ul').carouFredSel 
      ({ 
      auto:true, 
      items: { width: 200, height: 200 }, 
      prev: { button: function() { return $(this).find('a.prev');}},    
      next: { button: function() { return $(this).find('a.next'); }},   
      }); 
    console.log($(this).find('a.prev')); //correct element returned, length 1 
    console.log($(this)); //correct element returned 
    }); 

Answer 1

Ponieważ strona przewija się do góry, problem polega na tym, że carouFredSel inicjuje w ogóle pagerów. Bardzo prawdopodobny problem z twoim znacznikiem.

Mam również pewne dziwne problemy z korzystaniem z opcji responsive : true, zgodnie z opisanymi właśnie liniami.

Utworzyłem jsFiddle pokazać przykład roboczy paginacji z wielu karuzel w kartach jQuery UI:

http://jsfiddle.net/EFC3X/

Answer 2

jeśli kod obok

<div class="image_carousel"> 
    <div class="sec_elem"> 
     <div class="tem-bl"> 
      <img src="image.jpg" alt=""/> 
     </div> 
     <div class="tem-bl"> 
      <img src="image.jpg" alt=""/> 
     </div> 
     <div class="tem-bl"> 
      <img src="image.jpg" alt=""/> 
     </div> 
    </div> 

    <a class="prev" href="#"></a> 
    <a class="next" href="#"></a> 
</div> 

jquery

$(".sec_elem").carouFredSel({ 
    circular: true, 
    infinite: false, 
    width:'100%', 
    auto : true, 
    scroll : { 
     items : 1, 
     pauseOnHover : true, 
     duration : 1000 
    }, 
    prev : { 
     button : function(){ 
      return $(this).parents('.image_carousel').find('.prev'); 
     }, 
     key  : "left" 
    }, 
    next : { 
     button : function(){ 
      return $(this).parents('.image_carousel').find('.next'); 
     }, 
     key  : "right" 
    } 
});