Question

我有一个像这样的新列表：

<ul>
  <li><a>new1</a></li>
  <li><a>new2</a></li>
  <li><a>new3</a></li>
</ul>

我希望ul只显示一个新的，然后新的将向上移动并消失。在接下来的5年里，另一个新的举动并消失。当最后一个消失时，第一个将再次发生。我不知道如何用jquery / javascript设置它。

Answer 1

您也可以使用jQuery来实现此目的，请找到以下fiddle。

<div id="container">
</div>

<button onclick="start()">
  Start/Stop
</button>


var i = 0,
  id = null;

function start() {
  if (id == null) {
    id = setInterval(prepareDom, 5000)

    function prepareDom() {
      jQuery("<ul><li>" + (i++) + "</li><li>" + (i++) + "</li></ul>").appendTo("#container");
    }
  } else {
    window.clearInterval(id);
    id = null;
  }
}

Answer 2

可能你可以试试这个：

<强> HTML

<ul id="marquee"> 
 <li><a>new1</a></li>
  <li><a>new2</a></li>
  <li><a>new3</a></li>
</ul>

<强> jquery的

window.setInterval(function () {
    var updated = $("#marquee li:first-child");
    $.unique(updated).each(function(i) {
      $(this).slideUp(function() {
        $(this).appendTo(this.parentNode).slideDown();
      });
    });
}, 5000);

演示：http://jsfiddle.net/mSmbv/1254/

如何让菜单ul每5秒翻新一次？

2 个答案: