我有一个可滚动的div.在OS X中,滚动条会自动隐藏自己,这比总是可见的滚动条更漂亮,但有时会让我的用户感到困惑.对此问题的一般回应是使用:: – webkit-scrollbar：
How can I prevent scroll bars from being hidden for OS X trackpad users in WebKit/Blink?
CSS – Overflow: Scroll; – Always show vertical scroll bar?
http://blog.0100.tv/2012/11/webkit-scrollbars-on-os-x/
这些解决方案的问题在于它们也会影响Windows上的Chrome用户,并且我希望让Windows上的Chrome用户具有与他们习惯相同的滚动体验.
有没有办法阻止滚动条隐藏在OS X而不改变任何滚动条样式,或者添加一些东西到我的CSS,这只会影响Mac用户？
谢谢！
解决方法
我认为韧性用户体验在Windows和Mac中保持相同的外观.你可以使用一个插件使它在两个系统中都更加滑动,比如NanoScroller：
你的HTML：
<head>
<link rel="stylesheet" href="nanoscroller.css">
</head>
<body>
<!-- Your Element -->
<div id="about" class="nano">
<div class="nano-content">
<!-- Your content -->
</div>
</div>
<script src="jquery.js"></script>
<script src="nanoscroller.js"></script>
<script src="all.js"></script>
</body>
你的JS(all.js)
$(function(){
// binding nanoScroller.
$('.nano').nanoScroller({ alwaysVisible: true });
})
在这里查看整个Doc：
https://jamesflorentino.github.io/nanoScrollerJS/
