Inspiring Web Navigations: Parallax And Scrolling

It’s just HTML5, Javascript and imagination. Well done.

Take a look at these examples:

Hobo Lobo of Hamelin

A infantile storytelling website. Uses parallax and horizontal scrolling.

Ben The Body Guard

Creative hotsite for a “phone data protector”. Uses vertical scrolling. It looks even better on the iPhone.

20 Things I Learned About Browsers And The Web

Browse and animate pages like a real book, has a nice summary. It was created by Hakim El Hattab, who has some nice HTML5 and WebGL experiments on his website.

Nike Better World

Another creative hotsite, created by Nike. Uses vertical scrolling and parallax effect. Not so cool on the iPhone, but it still navigable.

Parallax give to the user a much immersive way to scroll the page. But it surely have to be well-designed.

You can get started from this example, made by Brett Jayolr. He uses CSS and pure Javascript to create a simple background parallax effect.

Have a nice coding!