Web Development News, Tips, Insights | Website Magazine

Make Device Tilting Fun with Parallax.js

Written by Peter Devereaux | Aug 29, 2013 5:00:00 AM

What makes today's websites so much more interesting than their digital predecessors is that they have the capacity to react to how it is being viewed. 

 

Responsive design pretty much dominates the conversation in certain circles, but if you're looking to include some additional interactivity for a site that may be viewed on smartphones or tablets (anything with a gyroscope) then check out Parallax.js.

 

The lightweight Parallax Engine reacts to the orientation of a smart device. Where no gyroscope or motion detection hardware is available, the position of the cursor is used instead. You really have to see it to believe it. 

 

There are a number of behaviours that designers and devs can setup for any given Parallax instance. The behaviours can either be specified in the markup via data attributes or in JavaScript via the constructor and API.