Cara Menggunakan Fungsi mouseenter dan mouseleave Pada jQuery
Halo teman – teman selamat datang kembali di tips dan trik Source Code Aplikasi, di artikel sebelumnya kita pun telah membahas beberapa kegunaan – kegunaan di jQuery. Dan di kesempatan kali ini saya akan memberikan tips dan trik mengenai Cara Menggunakan Fungsi mouseenter dan mouseleave Pada jQuery kegunaan ini dapat kita gunakan bagi menghasilkan layout yang variatif pastinya berhubungan dengan interface antara user dan tampilan. Dengan tampilan yang atraktif merancang situs kita banyak di sukai oleh user, karena interaksi antara user dan tampilan terjalin dengan adanya sedikit adanya animasi. Kali ini kita akan mencoba mempraktekkan dengan studi case yang sederhana
Bagus, sekarang ini kita lanjutkan implementasikan Cara Menggunakan Fungsi mouseenter dan mouseleave Pada jQuery teman – teman siapkan text editornya dan copy script html nya di bawah ini
<!DOCTYPE html>
<html>
<head><br> <title><strong>Cara Menggunakan Guna mouseenter dan mouseleave Di jQuery</strong></title>
</head>
<body>
<p>Click or move the mouse pointer over this paragraph.</p>
</body>
</html>
Save dengan nama index.html, kemudian berikutnya kita berikan library jQuery nya
https://code.jquery.com/jquery-3.2.1.min.js
Kemudian masukkan script jQuery nya di bawah ini
<script><br>$(document).ready(function(){<br> $(p).on({<br> mouseenter: function(){<br> $(this).css(background-color, red);<br> }, <br> mouseleave: function(){<br> $(this).css(background-color, blue);<br> }, <br> click: function(){<br> $(this).css(background-color, yellow);<br> } <br> });<br>});<br></script>Apabila telah save dan jalankan di browsernya, karenanya sekiranya berhasil ketika mouse berada di area tag p karenanya mouseenter akan di jalankan yang di dalamnya ada css background berwarna merah, kemudian ketika mouse keluar dari area tag p karenanya mouseleave akan di jalankan dan di berikan background berwarna biru, kemudian sekiranya tag p di klik karenanya akan berubah menjadi backgorund berwarna kuning. Seluruh itu ialah kegunaan dari mouseenter yang berarti akan berfungsi ketika mouse berada di pada area,kemudian mouseleave akan berfungsi ketika mouser keluar dari area nya, dan yang terakhir kegunaan click kemarin kita pun telah membahasnya. Teman – teman dapat review di artikel sebelumnya.
Baiklah inilah cara simpel bagi menggunakan kegunaan mouseenter dan mouseleave, teman – teman kembangkan lagi bagi belajar. Saya kira demikianlah dulu di artikel kali ini mengenai Cara Menggunakan Fungsi mouseenter dan mouseleave Pada jQuery kita berjumpa kembali di artikel berikutnya. Semoga bermanfaat, terimakasih dan hingga jumpa.
Sumber https://kursuswebsite.org
