使用JavaScript編輯自定義滾動條？

是否可以使用javascript編輯自定義滾動條？使用JavaScript編輯自定義滾動條？

這是我的自定義滾動條：

::-webkit-scrollbar { 
    width: 12px; 
} 

::-webkit-scrollbar-track { 
    -webkit-box-shadow: inset 1px 1px 6px 1px grey; 
    -webkit-border-radius: 2px; 
    border-radius: 2px; 
} 

::-webkit-scrollbar-thumb { 
    -webkit-border-radius: 2px; 
    border-radius: 2px; 
    background: yellow; 
    -webkit-box-shadow: inset 1px 1px 6px 1px rgba(0, 0, 0, 0.5); 
} 

::-webkit-scrollbar-thumb:window-inactive { 
    background: #000000; 
}

更改滾動條像這樣（不工作）：

jQuery('::-webkit-scrollbar').css('width', '120px'); 
jQuery('::-webkit-scrollbar-thumb').css('background', 'orange');

或

document.body.scrollbar.style.width = '120px'; 
document.body.scrollbar.thumb.style.background = 'orange';

一個人如何去這樣做呢？謝謝。

來源

2014-03-29 usandfriends

我正在試圖做的是製作一個自定義滾動條，當鼠標懸停在它上面時會作出反應。當鼠標懸停在滾動條上時，寬度增加，因此用戶可以更容易地拖動滾動條大拇指。 – usandfriends

後的研究時間，我發現這是不可能的編輯與JavaScript的瀏覽器的默認滾動條。

我發現的唯一解決方案是使用jScrollPane和jQuery的.hover()功能來編輯自定義html滾動條。

您還可以將CSS來定製HTML的滾動條，使其像瀏覽器的defalt滾動+ JavaScript編輯。

這方面的例子可以發現here。

來源

2014-04-03 21:54:40 usandfriends

使用JavaScript編輯自定義滾動條？

回答

相關問題