ButtonsLesson 101Preview gratis
Animated Buttons
Lesson ini bagian dari How To · Semua level
Ringkasan
Animated button memberi umpan balik visual saat pengguna mengarahkan kursor atau menekan tombol. Animasi dapat berupa perubahan warna, panah yang muncul, atau efek tertekan yang halus. Kuncinya adalah durasi singkat dan gerakan yang tidak mengganggu keterbacaan.
Poin kunci
- Properti transition membuat perubahan gaya berjalan halus.
- Pseudo-element ::after dapat menambahkan ikon panah tanpa mengubah HTML.
- Transform dipakai untuk menggeser atau memperbesar elemen secara efisien.
- Durasi animasi sebaiknya sekitar 150-300 ms agar terasa responsif.
- Hormati preferensi prefers-reduced-motion milik pengguna.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.