Question

如果我有一个具有设定高度的div，并且其中有一长串项目，您可以使用箭头键向下滚动，如何保持当前所选项目在视图中？

以下是我尝试过的代码的链接：

＆＃13;

$(document).ready(function(e) {
  var index = 0;

  for (var i = 0; i < 100; i++) {
    $("<li />", {
      "id": "item" + i,
      "text": "test " + i
    }).appendTo("#ul_par");
  }

  $(document).bind("keydown", function(e) {
    var code = e.keyCode || e.which;
    if (code == 40) {
      index = index + 1;
    } else {
      index = index - 1;
    }

    $("#ul_par li").css("background", "#fff");
    $("#ul_wrapper").animate({
      scrollTop: $("#item" + index).offset().top + "px"
    }, 1000);
    $("#item" + index).css("background", "#ff0000");
  })
});

＆＃13;

#ul_wrapper {
  height: 50px;
  overflow: auto;
  border: 1px solid #d3d3d3;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="ul_wrapper">
  <ul id="ul_par"></ul>
</div>

＆＃13;

谢谢你的时间

------ EDIT ----------

我在这篇文章中找到了答案：

How do I scroll to an element within an overflowed Div?

对不起，重复

将元素集中在可见区域内

0 个答案: