javascript - 在另一个 div 中滚动 div

Question

我想在第二部分添加滚动，它是“聊天栏”div 中的“chat-messages”div。我只希望这个“聊天消息”可以滚动，让网站的其余部分没有任何滚动条。此时此刻，我必须滚动整个站点才能看到“输入行”div。当我将 overflow: auto 设置为“聊天栏”但随后整个 input-row 也包含在滚动中时，它非常有效。请给我最好的 css/html 选项如何解决这个问题，或者给我简单的 javascript 库。

jsfiddle 链接:

jsfiddle.net/o9vmfgpx/3

编辑: 我让它工作了，但以一些 hacky 的方式。

.chat-messages {
    overflow-y: scroll;
    -ms-overflow-style: none;
}
.chat-messages::-webkit-scrollbar {
    display: none;
}

@-moz-document url-prefix() {
    .chat-messages {
        right: -5%;
        padding-right: 3%;
    }
}

适用于最新版本的 IE、EDGE、Chrome、Firefox 和 Opera(截至 10.14.2016)

Answer 1

这应该有效。

body {
      overflow:hidden;
}
.chat-messages {
       overflow:scroll !important;
}