scrollIntoView 滚动得太远 [英] scrollIntoView Scrolls just too far

问题描述

我有一个页面，其中一个滚动条包含从数据库动态生成的带有 div 的表格行.表格的每一行就像一个链接，有点像您在视频播放器旁边的 YouTube 播放列表中看到的那样.

I have a page where a scroll bar containing table rows with divs in them is dynamically generated from the database. Each table row acts like a link, sort of like you'd see on a YouTube playlist next to the video player.

当用户访问页面时，他们所在的选项应该转到滚动 div 的顶部.此功能正在运行.问题是它走得太远了.就像他们所选择的选项太高了大约 10px.因此，访问该页面时，该 url 用于标识选择了哪个选项，然后将该选项滚动到滚动 div 的顶部.注意:这不是窗口的滚动条，它是一个带有滚动条的div.

When a user visits the page, the option they are on is supposed to go to the top of the scrolling div. This functionality is working. The issue is that it goes just a tad too far. Like the option they are on is about 10px too high. So, the page is visited, the url is used to identify which option was selected and then scrolls that option to the top of the scrolling div. Note: This is not the scroll bar for the window, it is a div with a scrollbar.

我正在使用此代码将选定的选项移动到 div 的顶部:

I am using this code to make it move the selected option to the top of the div:

var pathArray = window.location.pathname.split( '/' );

var el = document.getElementById(pathArray[5]);

el.scrollIntoView(true);

它将它移动到 div 的顶部，但向上移动了大约 10 个像素.有人知道怎么解决吗?

It moves it to the top of the div but about 10 pixels too far up. Anyone know how to fix that?

推荐答案

如果它是大约 10px，那么我想你可以像这样手动调整包含 div 的滚动偏移:

If it's about 10px, then I guess you could simply manually adjust the containing div's scroll offset like that:

el.scrollIntoView(true);
document.getElementById("containingDiv").scrollTop -= 10;

这篇关于scrollIntoView 滚动得太远的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！