我如何在jcarousel中获得可见的中间li？

Question

我有这种情况。中间的两个项目总是比其他项目大，我不知道如何得到它 我正在使用jcarousel。如果还有另一个替代jquery插件，那将是受欢迎的。

Answer 1

wat jQuery替代方案;）它非常简单但可以工作

http://codepen.io/dmi3y/full/dCvkl

好的例子是在codepen上，它的核心是片段

(function(){
    $('.scroll-gal').each(function(){
        var el = $(this), ul = $('ul', el);
        $('div', el).not('.vewport').click(function(){
            if(ul.is(':animated')) return;
            var dly = 200, first = $('li:first', ul), last = $('li:last', ul);
            switch($(this).css('float')){
            case 'left':
                ul.css('left', -last.outerWidth(true)).prepend(last).animate({'left': 0}, dly);
            break;
            case 'right':
                ul.animate({'left': -first.outerWidth(true)}, dly, function(){
                    $(this).append(first).css('left', 0)
                });
            break;
            }
        });
    });
})();

核心思想只是在繁重的DOM操作中，我需要解释一下。

好的，当你点击右键时会发生什么：

ul.animate({'left': -first.outerWidth(true)}, dly, function(){
    $(this).append(first).css('left', 0)
});

首先将整个ul容器设置为右边的动画，并在动画结束时将第一个项目放入列表中，将其放在最后。这很容易。

左侧动画有点棘手：

ul.css('left', -last.outerWidth(true)).prepend(last).animate({'left': 0}, dly);

在第一点快速移动ul容器向右（左侧负），而不是立即取出最后一个项目并将其放在第一个位置，并在此之后将动画放到左侧。

你看，引擎盖下的这么多电话，这就是为什么它很重。但它在大多数实现中都会顺利运行，尽管它具有巨大的优化潜力。