如何防止滾動條隱藏在OS X上而不影響Windows用戶？

我有一個可滾動的div。在OS X中，滾動條會自動隱藏自己，這比總是可見的滾動條更漂亮，但有時會讓用戶感到困惑。對這一問題的普遍反應是使用::-webkit-scrollbar：如何防止滾動條隱藏在OS X上而不影響Windows用戶？

這些解決方案的問題在於，他們也可以在Windows衝擊Chrome用戶，我想讓Chrome用戶保持與以往相同的滾動體驗。

有沒有辦法阻止滾動條隱藏在OS X上而不改變任何滾動條樣式，或者添加一些東西到我的CSS，這樣只會影響Mac用戶？

謝謝！

來源

2016-07-24 JSP64

由於您似乎想讓Chrome用戶擁有滾動體驗，因此我還建議您將其放在OS X上。此處的用戶也更喜歡scrollin克服他們習慣的經驗，所以如果你把事情保持原樣，你會爲他們提供服務。驚訝的用戶是用戶體驗決定的一個標誌。也就是說，如果您仍然願意繼續並覆蓋用戶的首選用戶界面，請使用JavaScript進行用戶代理嗅探 - 尋找「Mac」或「Chrome」或用戶代理字符串中的任何內容 - 並相應地應用CSS。如果您想了解更多信息，我可以提供詳細的答案。 – amn

我認爲韌體用戶體驗在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 }); 
})

看到整個文檔在這裏： https://jamesflorentino.github.io/nanoScrollerJS/

來源

2017-05-24 14:12:17

如何防止滾動條隱藏在OS X上而不影響Windows用戶？

回答

相關問題