2011-08-24 240 views
0

我希望能夠將自定義滾動條合併到我的網站中,因爲有設置高度的div會溢出。我已經設法得到我想要的CSS樣式的CSS,但我知道在Firefox或IE中查看網站時會出現問題。自定義滾動條

因此,我試圖將jScrollPane庫合併到我的網站中,但它導致各種js「衝突」,導致整個網站陷入混亂!

有沒有更簡單的方法來定製我的滾動條,以便跨瀏覽器兼容性而無需向該網站添加新的js頁面?

另外 - 有什麼辦法可以附加一些東西到瀏覽器是Firefox的時候!

感謝 JD

+0

['-moz'特定的CSS擴展在MDN上列出](https://developer.mozilla.org/en/CSS_Reference/Mozilla_Extensions)。 – zzzzBov

+0

在這裏看到我的答案:http://stackoverflow.com/questions/7357203/custom-scrollbars/32424642#32424642 – Buzinas

回答

0

我與你問什麼的有點糊塗了,但如果你正在尋找某種可以用CSS來定製的滾動條,那沒有比jQuery UI's Slider

您將不得不添加一些事件處理程序來執行滾動操作,但它不應該太困難。

+0

會給它一個旋風。謝謝! – JD2011

0

這裏有一些自定義的滾動條你可以使用: http://www.net-kit.com/jquery-custom-scrollbar-plugins/

一休這些解決方案應該工作。 BTW我用JScrollPane的,它就像一個魅力對我來說

+0

嗨盧克 - 感謝您的迴應 - 已經通過這些例子並試用過,但似乎無法讓他們工作,而不會干擾我當前的JavaScript!非常沮喪..... – JD2011

1

我經歷了所有的上述建議去,並通過以下任一問題感到失望:

  1. 跨瀏覽器的兼容性較差
  2. 滯後
  3. 大量的冗餘代碼/依賴(jQuery UI的)

因此,我用一些CSS技巧和JavaScript(依賴於jQuery選擇),以建立自己的丘斯托m滾動條的實現。演示可在https://dev.anuary.com/680a3c94-9651-550f-abca-e853613eb9ce/。源代碼位於https://github.com/anuary/jquery-custom-scrollbar

我的方法依賴於本機瀏覽器滾動條。但是,此實現不支持水平滾動條。

+0

現在這兩個鏈接都死了。考慮更新你的答案。 – lolbas

0

快進到2017年,有很多優秀的自定義腳本,滾動條,這些天。我的意思是依靠本地滾動機制並在移動設備上工作。我使用的是Perfect Scrollbar。在這篇博文中,其他一些好的可以是found here