JQuery шпион двигаться влево - PullRequest
Новая
       22

JQuery шпион двигаться влево

0 голосов
/ 14 февраля 2012

Как я могу изменить шпионский скрипт jquery, чтобы он двигался горизонтально? (Теперь он движется вертикально).

Я думаю, что изменения должны быть сделаны в этой части кода: 

  (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 Ответ

1 голос
/ 14 февраля 2012

Я бы использовал CSS, чтобы перемещать элементы списка ... это должно сработать. 

li { float: left; }
...