我怎样才能在 jcarousel 中获得可见的中间 li？

Question

我有这种情况。中间的两个东西总是比其他的大，不知道怎么弄。
我正在使用 jcarousel。如果有其他替代 jquery 插件，将受到欢迎。

Answer 1

wat jQuery 替代方案 ;) 它非常简单，但很有效

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

好的例子在codepen上，它的核心是sn-p

(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 容器向右（负向左）快速移动，然后立即将最后一个项目放在第一位，然后在这个动画之后向左移动。

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