This experiment is from DesignShack.net. There are three background images given to body that are separated by a comma and are tileable so repetition is not a problem here. These images are initially given a 0px 0px background position and then animated using the animation and keyframes properties.
The animation is done on the background position of these snow images and to create the parallax effect, different values of the background position are given to the different images. (i.e., the top layer is given high value so that it moves faster than others). The animation looping is set to infinite so it never stops. It works great in all major browsers except Internet Explorer as it doesn't support animation yet.
- Canvas Query / Swipe Demo
- CSS3 navbar with Responsive Collapse
- Tooltips on hover and focus, with transitions CSS ONLY
- more mask-images
- Google business card - Full CSS