jquery间谍向左移动

时间:2012-02-14 08:40:15

标签: jquery jquery-slider

如何修改jquery spy脚本以使其水平移动?(现在它垂直移动)。

我认为必须在代码的这一部分中进行修改:

  (function ($) {
    $.fn.reverseOrder = function() {
        return this.each(function() {
            $(this).prependTo( $(this).parent() );
        });
    };


    $.fn.simpleSpy = function (limit, interval) {
        limit = limit || 4;
        interval = interval || 4000;

        return this.each(function () {

1。建立     捕获所有有趣标题的缓存     将列表缩小以限制li元素

  var $list = $(this),
                items = [], // uninitialised
                currentItem = limit,
                total = 0, // initialise later on
                start = 0,//when the effect first starts
                startdelay = 4000;
                width = $list.find('> li:first').width();

            // capture the cache
            $list.find('> li').each(function () {
                items.push('<li>' + $(this).html() + '</li>');
            });

            total = items.length;

            $list.wrap('<div class="spyWrapper" />').parent().css({ width : width * limit });

            $list.find('> li').filter(':gt(' + (limit - 1) + ')').remove();

    // 2. effect 



        function spy() {
            // insert a new item with opacity and width of zero
            var $insert = $(items[currentItem]).css({
                width : 0,
                opacity : 0,
                display : 'none'
            }).prependTo($list);

            // fade the LAST item out
            $list.find('> li:last').animate({ opacity : 0}, 600, function () {
                // increase the width of the NEW first item
                 $insert.animate({ width : width }, 600).animate({ opacity : 1 }, 1000);

                // AND at the same time - decrease the width of the LAST item
                // $(this).animate({ width : 0 }, 1000, function () {
                    // finally fade the first item in (and we can remove the last)
                    $(this).remove();
                // });
            });



        currentItem++;
        if (currentItem >= total) {
            currentItem = 0;
        }

        setTimeout(spy, interval)
    }

    if (start < 1) {
           setTimeout(spy,startdelay);
            start++;
        } else {
        spy();
        }

});

例如: http://dart-foto.ru/index_p.php

http://jqueryfordesigners.com/simple-jquery-spy-effect/

1 个答案:

答案 0 :(得分:1)

我使用CSS来浮动列表项......这应该可以解决问题。

li { float: left; }