jquery - 没有克隆的jQuery滑块

Question

是否可以使用 jquery 进行不克隆的连续/旋转滑块？要求加载最后一张和上一张幻灯片的 25% 的一半应与第一张/当前幻灯片一起显示。当用户点击下一个/上一个按钮时，它必须是旋转的。

我已经尝试过克隆，但是较小的分辨率很好，在较大的分辨率下甚至显示了 clonnig div。我不应该显示克隆 div。

如果有任何堵塞，请建议我。

Answer 1

<div id="MainSliderContent" style="display: table-cell;">
    <div class="Message">
        Test 1
    </div>
    <div class="Message">
        Test 2
    </div>
    <div class="Message">
        test 3
    </div>
    <div class="Message">
        Test 4
    </div>
</div>​


 $(document).ready(function () {
        //if ($('#MainSliderContent').find('div.Message').length > 1) {
        $('#MainSliderContent').find('div.Message:not(:first)').hide();

        $('#MainSliderContent').live({
            mouseenter: function () {
                $(this).addClass('Hover');
            },
            mouseleave: function () {
                $(this).removeClass('Hover');
            }
        });

        setInterval(function () {
            if (!$('#MainSliderContent').hasClass('Hover')) {
                var $messageObj = $('#MainSliderContent').find('div.Message:visible');
                $messageObj.slideUp('slow').next('div.Message').slideDown('slow');
                $('#MainSliderContent').find('div.Message:last').after($messageObj);
            }
        }, 1 * 1000);
        //}
    });​

演示见这个链接：http: //jsfiddle.net/nanoquantumtech/BJ6R7/

Answer 2

您可以使用任何滑块

https://github.com/ProLoser/AnythingSlider/wiki/Usage

用于克隆的代码是

slider.$items//callback argument