Question

所以，我希望用CSS，HTML和jQuery实现一个特别独特的目标。基本上，我有一个页面元素，当我鼠标悬停它时，我想要滚动被禁用。我目前通过将body的overflow属性设置为“hidden”来实现此目的。然而，消失的滚动条意味着内容向右移动以填充由消失的垂直滚动条创建的空白。有没有让页面表现为溢出：隐藏但仍然显示滚动条占位符？

Answer 1

你可以通过在div中使用div来实现它，这样外部div可以滚动（自动），然后在鼠标悬停时调整内部div的大小就是正确的大小。

所以举例......

<强> HTML ：

<div id="outerTest" >
    <div id="innerTest" >
        ...content goes here...
    </div>
</div>

<强> CSS ：

#outerTest {
    width: 100px;
    height: 100px;
    overflow: scroll;
}
#innerTest {
    overflow: hidden;
}

<强>的jQuery ：

$("#outerTest").hover(function() {
    $("#innerTest").css({width: "100%", height: "100%"});
}, function() {
    $("#innerTest").css({width: "auto", height: "auto"});
});

Answer 2

或者，您也可以实现基于jQuery的滚动条。 jScrollPane

奇怪的HTML / JS / CSS滚动条功能难题

2 个答案: