How to Get a Custom Scroll in Firefox and Ie

Custom CSS Scrollbar for Firefox

As of late 2018, there is now limited customization available in Firefox!

See these answers:

• https://stackoverflow.com/a/54101063/405015
• https://stackoverflow.com/a/53739309/405015

And this for background info: https://bugzilla.mozilla.org/show_bug.cgi?id=1460109

---

There's no Firefox equivalent to ::-webkit-scrollbar and friends.

You'll have to stick with JavaScript.

Plenty of people would like this feature, see: https://bugzilla.mozilla.org/show_bug.cgi?id=77790

---

As far as JavaScript replacements go, you can try:

• https://github.com/mdbootstrap/perfect-scrollbar
• https://github.com/Grsmto/simplebar
• https://github.com/vitch/jScrollPane

how to get a custom scroll in firefox and IE?

That is a proprietary webkit property. There is no equivalent for FF or IE.

You can, however, do what you're looking for with jQuery.

http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html

Edit: Uhhh.. there literally is no Firefox equivalent and the person asking the question literally must either use a javascript solution, or no solution at all. Downvotes won't change that.

How can I create custom scrollbar for Mozilla Firefox with CSS?

On this side the firefox scollbar is cancelled.

http://codemug.com/html/custom-scrollbars-using-css/

But look here:

http://jscrollpane.kelvinluck.com

http://hesido.com/web.php?page=customscrollbar

http://script-tutorials.com/custom-scrollbars-cross-browser-solution

http://manos.malihu.gr/jquery-custom-content-scroller

These are plugins that work for all browsers.

Plugin only for firefox:
https://addons.mozilla.org/de/firefox/addon/noiascrollbars/

I hope I could help you!

Scrollbars in mozilla

Since Firefox 64, is possible to use new specs for a simple Scrollbar styling (not as complete as in Chrome with vendor prefixes).

In this example is possible to see a solution that combine different rules to address both Firefox and Chrome with a similar (not equal) final result:

The key rules are:

For Firefox

.scroller {
  overflow-y: scroll;
  scrollbar-color: red green;
  scrollbar-width: thin;
}

For Chrome

.scroller::-webkit-scrollbar-track
{
    background-color: green;
}

.scroller::-webkit-scrollbar
{
    width: 8px;
    background-color: #F5F5F5;
}

.scroller::-webkit-scrollbar-thumb
{
    background-color: red;
}

In the example linked are used also additional styles for Chrome to improve final style (such as rounded corners and shadows)

custom scrollbar firefox with css or jquery

There are some usefull tips about your question:

How to hide scrollbar in Firefox?

In this topic are many answers on this question, i suggest you to choose this one which fits your needs.

---

Related Topics