Question

我编写了一个脚本，可以自动从下到上滚动li个元素。这是我在jsbin上的script。

我正在努力实现现在从上到下滚动项目的相反效果，但到目前为止尚未成功。 Here是我到目前为止所尝试过的。

有人可以在这方面帮助我吗？提前谢谢。

JavaScript代码：

$('#scroller').bind('touchmove',function(e){
      e.preventDefault();
      // Write code to scroll the items
      alert("Touch move occured");

});


function run() {
  /*  
    var prev = $("#scroller li:first-child");
    $.unique(prev).each(function(i) {
      $(this).delay(i*10).slideDown(function() {
        $(this).appendTo(this.parentNode).slideDown();
      });
    });
  */
  $("#scroller li:last").slideUp(function() {
        $(this).remove();
        $("#scroller").prepend($(this));
        $(this).slideDown();
    });
}

window.setInterval(run, 100);

相关的HTML：

    <div id="wrapper">
        <div id="panels">
            <div  id="scroller">
                <ul>
                                      <li> Barley Wine </li>
                                      <li> Bitter Ale </li>
                                      <li> Brown Ale </li>
                                      <li> India Pale Ale </li>
                                      <li> Pale Ale </li>
                                      <li>list 1</li> 
                                      <li>list 2</li>
                                      <li>list 3</li>
                                      <li>list 4</li>
                </ul>
            </div>
        </div>
    </div>

Answer 1

您将<li>元素添加到<div>而不是<ul>。只需将“滚动条”ID移动到<ul>，它就会好很多。

JavaScript - 如何将li元素从上到下滚动

1 个答案: