如何平滑地隐藏滚动条?

时间:2015-06-17 13:06:32

标签: javascript jquery css3 scrollbar css-transitions

我需要平滑地隐藏身体滚动条。我试过溢出:隐藏过渡但它不起作用。在此先感谢

4 个答案:

答案 0 :(得分:2)

不幸的是,没有“短而简单的”#39;这样做的解决方案。滚动条本身不是一个元素,因此您最终必须自己制作,并在其上添加hoverclick效果或其他元素。幸运的是,其他StackOverflow用户之前已经完成了这项工作,并与我们分享了这一点,以便我们将来可以使用它并从中学习。后者是当然的主要原因,因为那是SO主要用于的目的。

See this JSFiddle.

这个小提琴模仿了Facebook滚动条的功能,当你不再徘徊时,淡出。您需要做的就是使其与click()事件而不是hover()事件一起使用。

答案 1 :(得分:0)

我知道我有点迟了但是你帮我了,所以我不妨试着帮助哈哈。

可以将selector :: - webkit-scrollbar修改为不透明度为0,如果你在jQuery或JS中编写它,你可以同时应用overflow:hidden。喜欢add :: - webkit-scrollbar {opacity:0;过渡:所有.25s;}无论何时你想要。

从这篇文章中获得了选择器。 https://css-tricks.com/custom-scrollbars-in-webkit/

答案 2 :(得分:-2)

您可以使用以下代码隐藏滚动条

这将隐藏textareas的所有滚动条。

 textarea 
{ 
    overflow:hidden;
}

您还可以使用textarea的id或类来使其只有一个

textarea#txt 
{
overflow:hidden;
}

答案 3 :(得分:-2)

这将根据您的需要平滑地隐藏滚动

jQuery('html,body')。stop()。animate({scrollTop:900},500,function(){});