jcarouselPagination: la variable 'page' change sur le redimensionnement

Question

J'ai un jcarousel avec 3 éléments à l'intérieur avec id unique (1,2,3). Lors du chargement, les éléments jcarouselPagination fonctionnent parfaitement et ont le bon targeter ("data-item = 1,2,3"). Mais lorsque je redimensionne mon écran sur un support petit ou petit, les éléments jcarouselPagination ne ciblent pas correctement. Ils commencent à 2 ce qui entraîne ("data-item = 2,3,4").

Voici ma partie jquery où les articles sont créés de paginations:

if ($(".ce_jcarousel").length == 0) { 
    return; 
} 
$('.ce_jcarousel').jcarousel(); 
$('.cejcarousel-pagination') 
    .on('cejcarouselpagination:active', 'a', function() { 
     $(this).addClass('active'); 
    }) 
    .on('cejcarouselpagination:inactive', 'a', function() { 
     $(this).removeClass('active'); 
    }) 
    .jcarouselPagination({ 
     'item': function (page, carouselItems) { 
      return '<a data-item="'+ page +'" class="slider_ce_text ' + (page == 1 ? "active" : "") + '" href="#' + page + '"><div class="grey_dot"></div></a>'; 
     } 
    } 
); 

Je ne convoquent que cette fonction de la charge de la page, jamais redimensionner, donc j'avoir du mal à obtenir ce qui se passe! Merci!

Answer 1

Ok, donc je n ai pas vraiment compris pourquoi il didn t élaborer ou pourquoi mon carrousel gardé générer des éléments de pagination sur Redimensionner .. Mais il semble que je devais délier la fonction resize.jcarousel alors voici ma nouveau code (et de travail) si quelqu'un est intéressé!

if ($(".ce_jcarousel").length == 0) { 
return; 
} 
jcarousel.jcarousel({ 
    wrap: 'circular' 
}); 
$(window).unbind('resize.jcarousel'); 
$('.cejcarousel-pagination') 
     .on('jcarouselpagination:active', 'a', function() { 
      $(this).addClass('active'); 
     }) 
     .on('jcarouselpagination:inactive', 'a', function() { 
      $(this).removeClass('active'); 
     }) 
     .jcarouselPagination({ 
      perPage: 1, 
      item: function (page) { 
       return '<a data-item="' + page + '" class="slider_ce_text" href="#' + page + '"><div class="grey_dot"></div></a>'; 
      }, 
     }); 

window.onload = $("[data-item = '1']").addClass("active"); 

Pas sûr que ce soit la réponse absolue mais ça marche!