Question

我想在使用UL和LI元素构造的固定div中自动化滚动条。我发现了这个建议app.UseAuthentication();，但它不适合我。

$('#yourUL').scrollTop($('#yourUL li:nth-child(#)').position().top);

我的“li”按升序排序（最近的是在底部）。我想自动滚动到给定日期的下一个li。例如今天是12月26日，下一个活动是1月31日。因此，我想滚动对应于1月31日的li

https://jsfiddle.net/jojo1994/g0nmye8m/

Answer 1

您选择的是ul代码，而parent div有一个overflow-y会在内容溢出时添加滚动条，因此请将您的选择器从#ulid更改为.panel-body。

发件人

$('#ulid').scrollTop($('ul > li:nth-child(#)').position().top);

要

$('.panel-body').scrollTop($('ul > li:nth-child(2)').position().top);

$('.panel-body').scrollTop($('ul > li:nth-child(2)').position().top);

.panel-body > ul{ padding:0; margin:0; text-align:center; } .panel-body > ul > li{ padding:50px 0px; background:yellow; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="panel-body" style="max-height: 300px;overflow-y: scroll;"> <ul class="list-group" id="ulid"> <li>Date - 5/12/2017</li> <li>Date - 15/12/2017</li> <li>Date - 23/12/2017</li> <li>Date - 25/12/2017</li> <li>Date - 26/12/2017</li> </ul> </div>

Answer 2

也许这会对你有所帮助：

＆＃13;

 for(var i=2010; i<2250; i++){
    $('#ulid').append('<li id="'+i+'">'+i+'</li>');
}



function go(){
    var val= 2017;
    var y = prompt("Go where?", val);
    $('.panel-body').scrollTop($('#ulid #'+y).position().top - 2 * $('#ulid #'+y).height());
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="go()">Go</button>
<div class="panel-body" style="max-height: 300px;overflow-y: scroll;">
  <ul class="list-group" id="ulid">
     
  </ul>
   </div>

＆＃13;

滚动到Li Javascript

2 个答案: