Qué sabe hacer animejs@4 con poco código: staggers, timelines, contadores, dibujo de SVG, muelles y arrastre. Estética prestada de nominal.so (que está hecha con él). Cada bloque tiene su replay.
No se pudo cargar anime.js del CDN — hace falta conexión para ver este lab en movimiento.
01Cortinilla de texto — el revelado firma de Nominalanimate + stagger
La contabilidad se hace sola
mientras duermes.
02Ecualizador — stagger desde el centro, en buclestagger(from: 'center') + loop
03Cifras que cuentan — números como objetivo de animaciónanimate(objeto) + utils.round
04Timeline — el cierre del mes, orquestadocreateTimeline + posiciones '-='
05SVG que se dibuja — la gráfica en directosvg.createDrawable + createMotionPath
06Muelles — tres físicas distintas, mismas propiedadescreateSpring / outElastic / outExpo
Haz click en cada chip y compara cómo llega.
07Arrastrable con vuelta físicacreateDraggable