Question

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

我尝试过克隆，但是分辨率越小越好，即使显示clonnig div，分辨率也越大。我不应该展示克隆div。

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

Answer 1

您可以使用AnythingSlider

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

用于克隆的代码是

slider.$items//callback argument

Answer 2

<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);
        //}
    });

for demo请参阅此链接：http://jsfiddle.net/nanoquantumtech/BJ6R7/

没有克隆的Jquery滑块

2 个答案: