Paul. Paul. - 8 months ago 83
CSS Question

ScrollTop js - Firefox doesn't work

I have a problem with my scrollTop javascript code only for firefox. I have put some anchors on href links, and only on chrome/explorer does working the smooth scroll. On firefox doesn't. It jumps only on that button but it doesn't scroll to it.

Firefox console error: This site appears to use a scroll-linked positioning effect. This may not work well with asynchronous panning; see for further details and to join the discussion on related tools and features!

My code:

if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
$scrollWrapper = $(document);

scroll = function scroll(value, hash) {
currentHash = hash;
} else {
$scrollWrapper = $('html, body');

scroll = function scroll(value, hash) {

scrollTop: value + 30
}, {
delay: 500,
complete: function () {
currentHash = hash;


Firefox places the overflow at the html level, unless specifically styled to behave differently.

To get it to work in Firefox, use

$('body,html').animate( ... );

Working example The CSS solution would be to set the following styles:

html { overflow: hidden; height: 100%; }
body { overflow: auto; height: 100%; }

I would assume that the JS solution would be least invasive.