滚动到溢出div中的特定元素
[英]Scroll to specific element in overflowing div
问题描述
我有一个具有溢出功能的div ，其作用类似于列表（因为在所有浏览器中自定义并保持这种方式时，真正的“选择”是一件麻烦事）。
问题是，名单很长，我想，当页面加载列表“选择”元素会或多或少地在中间div ，像推杆selected=selected的option中select 。
这是小提琴
提前致谢。
3 个解决方案
解决方案1
2 2014-04-29 09:05:56
解决方案2
2 2014-04-29 09:23:28
如果使用jQuery，则可以使“选择”容器滚动到特定元素。 在这种情况下，我向随机li添加一个.select类，只是为了演示其工作原理。
然后，您可以按.selected元素根据其父元素的像素数在#wraptable容器上滚动。
$(function(){
var offsetSelectedElement = $(".selected").position().top;
$("#wraptable").scrollTop(offsetSelectedElement);
});
编辑：
要添加jQuery，请在页面顶部添加库：
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
...
</html>
如果您不想使用jQuery，则仍然可以通过纯JavaScript来实现相同的结果，但是需要更多代码：
var offsetSelectedElement = document.getElementsByClassName("selectedItem")[0];
var wrappable = document.getElementById("wraptable");
wrappable.scrollTop = offsetSelectedElement.offsetTop;
解决方案3
2 已采纳 2014-04-29 09:26:45
如果您只是想将滚动条带到中间，则可以尝试以下js：
document.getElementById('wraptable').scrollTop = document.getElementById('wraptable').scrollHeight / 2;
它将#wraptable的滚动滚动到中间。
在 React 中滚动到溢出的 div 的底部
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.