Animasi yang menumpuk saat pengguna menggerakkan kursor dengan cepat bisa terlihat aneh dan tersendat. Solusinya adalah menghentikan animasi sebelumnya. Artikel ini membahas cara menghentikan animasi dengan jQuery (stop).
Metode .stop()
<script>
$("#menu").hover(
function() { $(this).stop().slideDown(); },
function() { $(this).stop().slideUp(); }
);
</script>
Memanggil .stop() sebelum animasi baru mencegah antrean animasi menumpuk.
Contoh Kasus: Menu Dropdown yang Responsif
<script>
$(".dropdown").hover(
function() { $(this).find(".submenu").stop(true, true).fadeIn(); },
function() { $(this).find(".submenu").stop(true, true).fadeOut(); }
);
</script>
Argumen stop(true, true) menghapus antrean animasi dan langsung menyelesaikan yang sedang berjalan, membuat menu terasa sangat responsif.
Kesimpulan
Gunakan .stop() sebelum memulai animasi baru agar efek hover terasa responsif dan tidak tersendat. Gunakan stop(true, true) untuk menu dropdown yang perlu reaksi cepat.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi jQuery (api.jquery.com).

