Como hacer esto?

[Ddsdone]

Como se hace esto de la web completa a scroll, para que las animaciones comiencen cuando se las ve ?


http://www.yourmemoir.com/

[Alexis88]

Pues, dependiendo del avance de la barra vertical al desplazarse, se cargan las imágenes y efectos que se les añadieron, lo cual es posible con JS, no con CSS (ojo, el tema de la carga de imágenes y el scroll).

Saludos

[Ddsdone]

Hay algun post que explique el Js de esta web ? controladores de scroll o algo asi?

[pzin]

Es que es algo muy simple. Puedes detectar la posición de la barra de desplazamiento con scrollTop. Luego si llega a esa posición, puedes por ejemplo añadir una clase y que ya animarías con CSS.

[lmichailian]

Sumado a lo que comenta pzin, acá tenes un pequeño ejemplo de jQuery de un elemento que aparece si la distancia con respecto al top es mayor a 100px, sino el mismo desaparece. Es cuestion de imaginación y mirar la documentación de jQuery y CSS3 en al caso.


// primero ocultar #elemento
$("#elemento").hide();

// fade del #elemento
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('#elemento').fadeIn();
} else {
$('#elemento').fadeOut();
}
});

Saludos!