[SOLUCIONADO] Efecto de diseño css3 javascript

[rjulio21]

Buenas noches,

Tengo una duda sencilla. a ver si alguien sabe como hacer el efecto de esta pagina
http://inthe7heaven.com/illusion-html/#tab-4
Que cuando carga por primera vez, a medida que se va bajando con el mouse, los elementos de la pagina van apareciendo con efectos como de la libreria animated.

El tema lo coloque aqui pues es diseño, pero supongo que usan javascript tambien.


Muchas gracias a quien tenga la idea

[pzin]

Pues lo que es CSS, sin simplemente animaciones. Las animaciones pueden empezar cuando quieras, supongo que, sin mirar el código, que en el caso que pones las animaciones pueden ocurrir o bien al llegar a ese punto con el scroll o bien al aparecer esos elementos. En ambos casos es necesario usar JavaScript para detectar la posición, ya sea para añadir una clase a los elementos con la animación o para cargar esos elementos.

[rjulio21]

Iniciado por pzin

Pues lo que es CSS, sin simplemente animaciones. Las animaciones pueden empezar cuando quieras, supongo que, sin mirar el código, que en el caso que pones las animaciones pueden ocurrir o bien al llegar a ese punto con el scroll o bien al aparecer esos elementos. En ambos casos es necesario usar JavaScript para detectar la posición, ya sea para añadir una clase a los elementos con la animación o para cargar esos elementos.

Muchas gracias por responder pzin. si son css, keyframes de hecho. de esta libreria http://daneden.github.io/animate.css/, solo que pensé que así como existe esa libreria, que aunque uno puede crear las animaciones, ¿para que hacerlo si ya está hecho?
Por eso pensé que de repente ya tambien habia un plugin o algo que trabajara eso con esa libreria, y no tener que ponerme a hacer funciones en base al scroll por mi cuenta, pues lo he visto en varias paginas ya.
Pero vale. muchas gracias.

[pzin]

Bueno, haberlos haylos. Buscando en Google me topé con al menos seis: http://webdesignledger.com/tools/6-j...olling-effects

La cuestión es que crear ese efecto es bastante sencillo. Sólo tienes que calcular si el scroll llega hasta el elemento y añadir la clase donde tengas la animación. Yo intentaría hacerlo sin nada externo, porque al final, si usas algo externo, estarás cargando más cosas de las que vas a utilizar. Es como meter jQuery sólo para usar tres cosas.

[rjulio21]

Vale vale.... los efectos parallax no es lo mismo que lo que yo comento. de todos modos igualmente gracias. voy a hacerlo x mi cuenta entonces. :D