Belajar jQuery Focus dan Blur

Halo Sobat Webhozz, Kali ini kita akan mempelajari Efek Jquery Focus & Blur. Berikut langkahnya.

Pertama kita membuat koneksi html ke jquery, seperti ini

<!DOCTYPE html>
<html>
<head>
<title>Latihan jquery</title>
<script src="jquery-3.3.1.min.js"></script>

Lalu langkah kedua kita kasih perintah jquery berubah warna di form kita, seperti ini.

<script>
$(document).ready(function(){
    $("input").focus(function(){
        $(this).css("background-color", "#cccccc");
    });
    <!--$("input") itu berhubungan dengan input yang ada di body untuk merubah warna form dan focus dan blur perintah mewarnai formnya.-->
    $("input").blur(function(){
        $(this).css("background-color", "#ffffff");
    });
});
</script>
</head>

Langkah Ketiga kita Membuat formnya di dalam body.

<body>

Name: <input type="text" name="fullname"><br>
Email: <input type="text" name="email"><br>

</body>
</html>

Ini dia Hasilya.

Gimana sangat mudah kan!,
Sekian dari kami, Semoga Bermanfaat bagi sobat webhozz.

Related posts: