jquery - jcarousel.jcarousel ('visible' ) 交付的商品数量错误

Question

我在我的项目中使用 jcarousel 插件。我使用以下函数来实现产品 slider 的分页

actualizePagination: function(element) {
    var jcarousel = element.find('.jcarousel');
    var visibleItems = jcarousel.jcarousel('visible').length;
}

当我第一次加载带有产品 slider 的页面时，visibleItems 显示值 5(错误)。现在，当我在 productslider 上执行任何事件时，例如调整浏览器大小或单击 jcarosel 控件，visibleItems 变为 6，这是正确的。如何在插件中将 jcarosel 元素设置为“可见”？是更新错误吗？

Answer 1

这可能与 jcarousel v0.3.4 相关。我在第一次加载时收到的分页项目数量不正确。然后当我调整浏览器窗口大小时它会自行修复。新的窗口大小不一定会影响页面的布局，但可能会触发事件监听器。然后 jcarousel 获得正确的分页。我的代码是在文档就绪的情况下运行的。

然后我触发了窗口调整大小事件，它解决了问题。

$(window).trigger('resize');

我尝试延迟 jcarousel 激活，这也有效，所以我坚持使用这个解决方案。

setTimeout(function(){
            activateCarousel();
        }, 300);

function activateCarousel() {    
      $('.jcarousel').jcarousel();

      $('.jcarousel-pagination')
         .on('jcarouselpagination:active', 'a', function() {
             $(this).addClass('active');
         })
         .on('jcarouselpagination:inactive', 'a', function() {
             $(this).removeClass('active');
         })
         .jcarouselPagination();
}