вращение неупорядоченного списка автоматически с помощью jquery - PullRequest
2 голосов
/ 10 марта 2011

Я новичок в jquery, но я пытаюсь автоматически повернуть элемент списка.Например, у меня есть следующий неупорядоченный список ниже.

    <ul> 
      <li>list 1</li> 
      <li>list 2</li>
      <li>list 3</li>
      <li>list 4</li>
   </ul>

На данный момент у меня есть функция jquery, которая вращает список, но только когда пользователь нажимает на элемент списка, можно вращатьэтот список с использованием того же кода ниже, но это должно быть сделано автоматически?То есть без пользователя, кликающего по любому списку

$(function() {  
    $("li").click(function() {  
        var prev = $(this).prevAll();
    $.unique(prev).each(function(i) {
      $(this).delay(i*600).slideUp(function() {
        $(this).appendTo(this.parentNode).slideDown();
      });
    });
  });
});

Ответы [ 3 ]

4 голосов
/ 10 марта 2011

Этот пример вращается, не нажимая ни на один элемент.

function run() {
    var prev = $("#rotated li:first-child");
    $.unique(prev).each(function(i) {
      $(this).delay(i*600).slideUp(function() {
        $(this).appendTo(this.parentNode).slideDown();
      });
    });
}

window.setInterval(run,1000);
​

Демо: http://jsfiddle.net/mSmbv/

3 голосов
/ 10 марта 2011

http://jsfiddle.net/8ydLU/1

$(document).ready(function() {
    var swapLast = function() {
        $("ul li:last").slideUp('slow', function() {
            $(this).remove();
            $("ul").prepend($(this));
            $(this).slideDown('slow', function() {
                swapLast();
            });
        });
    }
    swapLast();
});

Обновлено в соответствии с комментарием от FarligOpptreden

1 голос
/ 20 сентября 2014

Это можно сделать одной строкой jquery ...

var swap = function() {
    $("ul li:last").hide().prependTo("ul").fadeIn(2000);
}
window.setInterval(swap,3000)

Вот скрипка http://jsfiddle.net/q71ub2q7/

...