在iOS浏览器中, 删除网页元素时怎么固定滚动条?

Question

在iOS浏览器中, 删除网页元素时怎么固定滚动条?


举个例子, 我有一些图片:

<div id="willHide">
<p><img 1/></p>
<p><img 2/></p>
<p><img 3/></p>
<p><img 4/></p>
</div>

<div>
<p><img 5/></p>
<p><img 6/></p>
<p><img 7/></p>
<p><img 8/></p>
</div>

在我当前浏览器位置为img 6 时, 如果我删除了<div id="willHide">
那么浏览器会跳到img 7 或者 img 8.
这个问题在iOS浏览器中会出现(Safari和Chrome), 在macOS中的Safari也会出现.
在macOS中的Chrome和Firefox就不会有这个问题. 当我删除前几张图时, 页面依然停留在img 6.

我做过以下尝试:

1. 在 div id="willHide" 中添加hidden属性代替删除
2. 用jQuery remove删除元素
3. 调试-webkit-overflow-scrolling
   
   但是问题始终存在. 目前我的结局方法为: let deleteHeight = $("#willHide").outerHeight(); let currentHeight = $(window).scrollTop(); $("#willHide").remove() $(window).scrollTop(currentHeight - prevHeight); 但这又会造成别的小问题, 并且会造成网页卡顿.

Answer 1

参考：https://www.cnblogs.com/wolfocme110/p/4025758.html