javascript - 将 DIV 滚动到绝对定位元素下方

Question

我有一个简单的网站，它有一个可滚动的 div。它工作正常，但我还需要一个绝对定位的 div 在它的顶部——我仍然需要它滚动，就好像它不存在一样。

你可以在这里看到一个粗略的 JSFiddle:http://jsfiddle.net/41rawrks/

您可以使用鼠标滚轮(或触控板)滚动 div，但如果光标越过其他元素(如下所示)，您将无法再滚动。我可以改变这个吗？

我想这是因为 DOM 不再认为光标在可滚动元素上“越过”可滚动元素(即使可拖动元素绝对位于可滚动元素内)。

我能做什么？

我没想到这是可能的，但这个网站做到了!

http://weareeli.dk

Answer 1

如果您将溢出从 #scrollDiv80s 切换到其父级 #wrapper80s 它会按您想要的方式工作:

#scrollDiv80s div {
    border: 1px solid black;
}
#wrapper80s, #wrapper90s, #wrapper00s {

    overflow-y: scroll; /* look at this */
    overflow-x: hidden; /* look at this */
    height: 100%;
    padding-left: 0px;
    padding-right: 0px;
    position: relative;
}
.decadeHeader {
    background-color: red;
    position: absolute;
    width: 100%;
    z-index: 99999;
    font-size: 28px;
    text-align: center;
}
.decadeHeader:hover {
    cursor: grab;
    cursor: -webkit-grab;
}
#scrollDiv80s  {
    /* overflow from child removed */
    border: none;
    height: 100%;
}