如何切换滚动条的显示？

Question

我想根据鼠标是否在容器上方来切换DIV容器上滚动条的显示。因此，当鼠标悬停在DIV容器上时，只显示滚动条（当然，DIV会溢出内容）。

我尝试使用CSS将溢出从隐藏更改为自动，反之亦然：

div.container {
    overflow: hidden;
}

div.container:hover {
    overflow: auto;
}

这会切换滚动条的显示，但是当再次显示滚动条时，它会重置为顶部。我需要将滚动条的位置保持在最后状态。

切换滚动条显示的最简单方法是什么？我试图继续使用纯CSS解决方案，但 minimal JavaScript可能没问题。

Answer 1

这可以说是一个WebKit错误。 Consider reporting it.

修改：已经at least one existing bug report了。虽然那个人有点不受欢迎。

---

目前，这是一个愚蠢的解决方法：

$('.container').hover(function(){
    var scrollTop = $(this).scrollTop();
    $(this).scrollTop(0).scrollTop(scrollTop);
});

请参阅： http://jsfiddle.net/C5vmK/

如果你还没有使用jQuery，可以很容易地编写它。