Catálogo de motion

Página interna para revisar cada efecto. No está indexada y se borra antes del lanzamiento. Pruébala en desktop y en celular, y con «reducir movimiento» activado en el sistema.

1. Entradas (todas las pantallas)

fade-up

fade-down

fade-left

fade-right

zoom-in

2. Escalonado (data-delay)

0ms

110ms

220ms

330ms

440ms

550ms

3. Contadores

entero + sufijo

decimales

simple

4. Tilt 3D (solo mouse; en táctil no hace nada, a propósito)

data-tilt="3"

data-tilt="6"

data-tilt="12"

5. Titular rotatorio

Construyo plataformas

6. Parallax (solo desktop ≥768px)

data-parallax="0.35"

7. Línea progresiva (draw-line)

Primero
Segundo
Tercero
Cuarto

8. Acordeón (sin JS)

¿Esto usa JavaScript?

No: es el elemento <details> nativo del navegador.

¿Funciona sin JS?

Sí. Y si el JS del sitio falla, el contenido con data-motion queda visible en vez de invisible.