Question

我正在使用Element.scrollIntoView()。滚动工作正常，但它同时打破了整个页面的布局。以下是演示：

＆＃13;

<div class=content>
  <!-- it's the ul to scroll, staying at the bottom of the page -->
  <ul>
    <li id=li>abc</li>
    <li>def</li>
  </ul>
  <!-- it's the div hidden under the bottom edge of the page -->
  <div id=div>i should stay hidden.</div>
  <button onclick=li.scrollIntoView();>scrollIntoView</button>
</div>

＆＃13;

<div>

＆＃13;

我在页面底部边缘隐藏scrollIntoView。当我<li> <ul>中的第<div>时，隐藏的<div>被撤出。不仅<li>，页面的整个内容都会被提取300px。

我希望只需将<ul>滚动到grep -o -P 'PATTERN' file的视图中即可。为什么它会影响整个页面的布局？

Answer 1

我想我自己找到了答案。见this answer。这是锚点，但我认为scrollIntoView在内部共享相同的机制。

浏览器将尽力确保元素可见。当它在容器中时，它将首先将容器滚动到具有最佳可见性的位置，因此内容被拉起。

使用Element.scrollIntoView（）的行为

1 个答案: