0

Here we have a recreation of the Nike Better World page:

http://ianlunn.co.uk/demos/recreate-nikebetterworld-parallax/

On Firefox it looks really nice, because Firefox has smooth(ish) scrolling.

On all of the other browsers I've tried (Safari, Opera, IE, Chrome) it looks much less nice because all of those browsers scroll half a screen at a time. Sometimes it's hard to tell that the parallax is actually an intentional effect on those browsers.

Here we have a wordpress theme:

http://themespectrum.com/parallax-demo/

It looks great on all browsers because (apparently) the designers have somehow changed the scroll wheel behavior and the page moves slowly enough that the parallax is animated instead of chunky.

How did they do this?

More broadly, should this be done? I don't like the idea of overriding such a fundamental aspect of the user's experience, but I also don't like how parallax looks on virtually any browser that isn't Firefox.

crowhill
  • 2,398
  • 3
  • 26
  • 55
  • I won't answer because it's not my own solution, but take a look at this question, seems to address "normalizing" scroll speed: http://stackoverflow.com/questions/5527601/normalizing-mousewheel-speed-across-browsers – Benjamin Robinson Jun 24 '14 at 17:15
  • That looks about like I thought it would. Kind of a mess, but it's a place to start. – crowhill Jun 24 '14 at 17:21
  • I'll also inspect that WordPress theme to see if I can figure out how they did it. Actually, since they have a "custom" scrollbar on the side there, too, I kind of think they bypassed the browser scroll entirely in favor of a JavaScript-powered one with a specific speed. – Benjamin Robinson Jun 24 '14 at 17:24

1 Answers1

1

Ha, potentially solved, they used this for their custom scrollbar on the WordPress theme: https://github.com/inuyaksa/jquery.nicescroll

Seems like an easier solution than actually trying to normalize the browser scroll speed.

  • That's it, for sure. I haven't looked at the source at all, but it must be doing something like normalizing because the scrolls speeds are different per browser (FF seems to be fastest now, IE slowest). Still not sure it's a good idea to use something like this, but the question is answered. – crowhill Jun 24 '14 at 20:18
  • Yeah, there still might be better ways, but I think the issue with speeds on this might simply be that all of those different browsers run JavaScript slightly faster/slower, but this did seem more even across browsers than default scroll. – Benjamin Robinson Jun 24 '14 at 21:00