Replymessage unavailable
Фотография
click to show
click to show
FLIP (Flow) Grid Transition with AnimeJS
https://wew.web.id/flip-grid-transition
FLIP berbasis flow layout yang mempertahankan bentuk dari HTML grid (contoh saat ini menggunakan Tailwind Grid) dimana perubahan layout antar state tetap terasa halus dan terkontrol.
Elemen mengikuti grid normal, dimana transisi setiap item diambil posisi relatif terhadap stage, freeze ke posisi absolute dan di animasi menjadi layout target yang dihitung melalui ghost grid.
Pendekatan ini untuk menjaga konsistensi koordinat (stage sebagai 0,0) sehingga animasi tidak terpengaruh perubahan viewport atau layout shift. Perpindahan antar layout bukan dengan perubahan struktur transformasi visual tapi tetap mempertahankan konteks posisi elemen yang dimengerti oleh browser.