Hai teman-teman semuanya? apa kabar? semoga tetap baik dan sehat ya teman-teman, kali ini kita akan belajar tentang jquery, seperti yang kita tau event didalam jquery sangatlah banyak, dan saya sudah bahas sedikiit banyak event-event serta fungsi yang ada pada jquery pada tutorial saya sebelumnya, pada tutorial sebelum ini juga saya telah membahas event mouseover() pada jquery, nah pada tutorial kali ini saya akan membahas kebalikan dari mouseover yaitu kita akan belajar tentang event mouseout() pada jquery.
Fungsi dari event mouseout() adalah untuk memberikan efek pada suatu element html ketika kita menjauhkan kursor pada element html tersebut, sebenarnya ini adalah kebalikan dari mouseover() pada jquery.
Oke untuk lebih jelasnya kita langsung saja praktekkan, pertama silahkan teman-teman buat sebuah file dan ketikan script berikut ini:
<!DOCTYPE html> <html> <head> </head> <body> <p style="background:red">Saya belajar Jquery.</p> </body> </html>
Pertama saya membuat sebuah paragraf dengan berwarna latar belakang merah, lalu saya memanggil core dari jquery.com yang saya letakan diantara element head :
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js”></script>
Lalu saya mengatur script dengan menggunakan mouseout() seperti berikut ini:
<script>
$(document).ready(function(){
$(“p”).mouseout(function(){
$(“p”).css(“background-color”, “lightgray”);
});
});
</script>
Dengan mengetikan script diatas berati saya mengatur ketika kursor menjauh dari element p maka element p yang awalnya berwarna background merah menjadi lightgrey.
Gimana teman-teman? cukup mudah bukan? untuk tutorial kali ini tentang belajar tentang event mouseout() pada jquery cukup sampai disini dulu, semoga tutorial yang singkat kali ini dapat bermanfaat untuk teman-teman semuanya, sampai bertemu lagi pada tutorial berikutnya.
Terima kasih.
The post Belajar Tentang Event mouseout() Pada Jquery appeared first on Kursus Website Terbaik.