CSS/JS 在绝对 DIV 中重置 DIV 的滚动位置

Question

我正在一个 div #popup 中加载一个图像，它位于一个名为#main的主包装器#main

#mask {
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.84);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    overflow-y: auto;
    overflow-x: hidden;
}

和

#popup {
    display: block;
    position: absolute;
    top: 30px;
    max-width: 960px;
    z-index: 9999;
    background-color: #efefef; 
    height: auto;
    left: 80px;
    right: 80px;
    margin: 0 auto;
    margin-bottom: 80px;
}

使用 jQuery 我在#popup加载一个图像，我可以上下滚动它，但是当我关闭覆盖层并加载另一个图像时，图像从顶部不可见......当我离开时它保持相同的滚动位置/关闭第一张图片...

不知道为什么...如何在不重置整个页面的情况下重置它？

$('#popup').scrollTop(0);

似乎不起作用...

Answer 1

您正在尝试重置错误 div 的滚动，您应该重置设置了overflow属性的 div 的滚动。

在这种情况下，处理滚动的 div 是#mask div，因此将scrollTop()应用于#mask元素。

$('#mask').scrollTop(0); 会做的工作。

调用scrollTop()时，请确保元素 ( #mask ) 已经可见。