Fungsi Hide Dan Show

Dengan menggunakan jQuery kita dapat menghilangkan dan memunculkan (hide and show) elemen HTML. Fungsi hide() digunakan untuk menghilangkan elemen HTML. Fungsi show() digunakan untuk memunculkan kembali.

Contoh di bawah ini memperlihatkan fungsi hide() dan show() yang digunakan pada elemen paragraf (tag p).

$("#hide").click(function(){
  $("p").hide();
});

$("#show").click(function(){
  $("p").show();
});

Jalankan Contoh

Parameter Fungsi Hide Dan Show #

Fungsi hide dan show dapat menerima dua parameter. Parameter pertama adalah speed yaitu kecepatan elemen HTML tersebut dihilangkan atau dimunculkan. Parameter ini dapat diisi dengan nilai string slow atau fast atau nilai waktu dalam milidetik. Parameter kedua adalah fungsi callback yang dipanggil apabila fungsi hide dan show telah selesai dijalankan.

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

$("button").click(function(){
  $("p").hide(1000);
});

Jalankan Contoh

Fungsi toggle #

Kita juga bisa membuat suatu elemen dihilangkan dan dimunculkan dengan menggunakan fungsi toggle. Perhatikan contoh di bawah untuk pemakaian fungsi toggle.

$("button").click(function(){
  $("p").toggle();
});

Jalankan Contoh

$(selector).toggle(speed,callback);