jQuery.noConflict();

(function($) {

    $(document).ready(function() {
        setTimeout(function() {
            $('ul.spy').simpleSpy();
        }, 4000);
    });

    (function($) {

        $.fn.simpleSpy = function(limit, interval) {
            limit = limit || 5;
            interval = interval || 10000;

            return this.each(function() {
                var $list = $(this),
                        items = [],
                        currentItem = limit,
                        total = 0,
                        height = $list.find('> li:first').height();

                $list.find('> li').each(function() {
                    items.push($(this));
                });

                total = items.length;

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

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

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

                        $(this).remove();
                    });

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

                    setTimeout(spy, interval)
                }

                spy();
            });
        };

    })(jQuery);

})(jQuery);