Connect With WRD
feed via e-mail
feed via e-mail

Posts Tagged ‘Parallax’

Parallax.js is a lightweight solution for creating parallax effects.

Besides mouse/cursor support, it works on mobile and tablet (where gyroscope or motion detection hardware is available) too.

It comes with multiple options for customizing the effect where they can be set inline using “data attributes” or in JavaScript.

The library can work standalone or as a jQuery and Zepto plugin (2 versions exist).

Parallax.js

Jarallax is a feature-rich JavaScript library for easily creating and customizing parallax scrolling effects.

The library enables us to manipulate CSS using keyframes and it supports custom controllers.

Jarallax

These controllers, compared to time-based animations, allows us to decide the events that animations will react to (scrolling, mouse gestures, etc.).

And, besides JavaScript animations, it can also use CSS-powered ones for a better performance.

P.S. The library makes use of jQuery.

Codrops, a creative web design and development blog, has created a detailed tutorial on creating a beautiful slider powered only by HTML and CSS3.

The slider not only uses the transition property but also changes the background-position of the given background images accordingly to create a parallax effect.

CSS3 Parallax Slideshow

Slides can be browsed either with the bullet-navigation (styled radio inputs) and/or with the prev-next links.

Both of the effects are very smooth and the slider adapts itself perfectly to any width (responsive).

Uptime Robot
feed-holder
FeedBurner
PSD2HTML.com