Firefox

[peteringram0]

This doesn't work at all on firefox (Demo page) Any solutions?

Thanks

[gromo]

Mac?

[peteringram0]

yer.

[gromo]

look at note below in the plugin description here: https://github.com/gromo/jquery.scrollbar

There is known issue that native browser scrollbar cannot be hidden in Firefox on Apple devices, so this plugin is not initialized and you will see native scrollbars.

[cletter7]

nanoScroller successfully hides native scrollbars in Firefox on Mac OS. So, it is possible.

[gromo]

@equinox7 I'm not sure that this way can be used in jQuery Scrollbar

[cletter7]

So, the reason mentioned in plugin description is not true:

There is known issue that native browser scrollbar cannot be hidden in Firefox on Apple devices, so this plugin is not initialized and you will see native scrollbars.

The reason is not in Firefox, it is in your plugin. Am I right?

[gromo]

No, you are not right.

I'm using negative margin-right to hide native scrollbars which cannot be used for overlay scrollbars like Mac's one. But in webkit-browsers native scrollbar can be hidden via CSS, and in Firefox there is no such option.

nanoScroller adds padding to the internal container to shift content from native scrollbar (if I understand right) which is not acceptable for CSS-customizable scrollbar like mine

[lassn]

How I fixed it:

there is actually a simple solution for that. You hide the scrollbars by CSS.
Simply set ".scroll-content" to "width: 200%". Put your scrollable content/text inside another

and give that one a width of 50%. The scrollbars of the browser will be in the overflow:hidden area.

.scroll-wrapper > .scroll-content {
width: 200%;
}

.scroll-wrapper > .scroll-content .scroll-content-inner {
width:50%;
padding-right: 10px;
}

<div class="scrollbar-inner">
<div class="scrollbar-content-inner">Hello World</div>
</div>

[cletter7]

@gromo

No, you are not right

It seems, I am right. All these plugins: perfectScrollbar, baron, nanoScroller work fine in Firefox on Mac OS.

[gromo]

It requires one more additional container besides wrapper and I'm trying to avoid this.

[lininu]

I tried the latest version of scrollbar and the issue still exists(MacOS Firefox). So, will it be altered in the future?

[gromo]

I'm planning to do this as a hack and only for vertical scrollbar.

[lininu]

Don't you consider to make horizonal scrollbar? I use the plugin in the navigation of responsive webpage. When the width become narrowed, the nav can be scroll with pretty style.

[gromo]

Unfortunately hiding FF scrollbar on Mac OS is a bit tricky. If it was easy, I would've done it a long time ago.

[lininu]

All right, thank you @gromo.

[fabien]

@gromo do you think this fix would help in this case?

Diokuz/baron@aa73971

[gromo]

@fabien if you got idea, you can try. I think it should help, but it takes a lot of effort to implement it to current realization

[Samic8]

@gromo Hiding the scrollbar in the lasted verision of Firefox seems to be a non-issue anymore. I have created a pull request here to allow Firefox usage.

[gromo]

I believe scrollbar type depends on Mac settings, so disabling FF check on Mac is not an option yet. Will check it later.

[igor-shevchenko]

@gromo did you have a chance to check it?

[faudzif]

I am facing probelm in RTL site firefox and IE shows the scrollbar on left side and in firefox with rtl direction browser.scroll.width shows 0 value in LTR shows 17

[gromo]

@faudzif not clear what is the problem. FYI: styles were not updated to support rtl, you have to do it by yourself.