danielsan22 / parallax

Hot Dot JavaScript Parallax Engine

Hot Dot Parallax Engine

See it in action

Code example in index.html

Features

• Horizontal slide-based-parallax with as many slides as you need.
• Easy to use! You don't need to write any JavaScript-code to make layers float with different speeds inside any of the slides.
• Positioning calculations are highly optimized.
• Smooth eased scroll that can be attached to any of your controls.
• Hashtags: share any of your slides directly!
• Key events like start of the scroll, end of the scroll or every step of the scroll are generated—you can bind anything to them.
• Preloader.
• Hardware acceleration that can be switched on or off depending on the device-OS-browser combination.
• Deep optimization: you can pause everything in your slide when the user is in the process of scrolling. Greatly enhances the experience and spares battery life on any platform.
• "Pointer-events:none"-optimization

Adaptivity-special features

• Resizeable-engine will fit the slide to the window or fill the window with it, if you want. When set, the rule works despite any window size change.
• Background image size is not fixed! You don't need to calculate anything—just plug in wide image for the background.
• Want to switch orientation of the slide depending on aspect ratio? Use Resizeable-engine to do it with ease.
• Proven to work well with touch devices and ready for iOS and Android platforms.

Made in Hot Dot by Fyodor Ananiev. Licensed under MIT.