0

How can i achieve this kind of animation effect (see link below) and where do I need to start learning, is this part of css or html5 or plugins, etc..

I have a startup knowledge in css and html5, but I have no idea how to achieve the effect.

http://www.terredevenements.com/en/

*the effect i'm referring to is the movement of the foreground images while the mouse hovers and still maintaining its background to be static

cracker_chan
  • 93
  • 3
  • 11

1 Answers1

0

This effect is called "parallax scrolling"

The basic idea is to layer images on top of each other and move them simultaneously but at different speeds, foreground moving faster than background.

Capturing and utilizing mouse events can be done with javascript/jQuery, and the animation can also be done with those languages or in combination with CSS3 animations.

There are quite a few jQuery plugins out there that can help you quickly achieve this effect.

See parallax.js

Or for more plugins: http://bashooka.com/coding/best-jquery-parallax-plugins/

jjroman
  • 20
  • 3