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);

Tutorial sebelumnya : Menangkap Event
Tutorial setelahnya : Mengambil Elemen Dan Konten
Semua Tutorial JQuery : Tutorial JQuery

Parameter Fungsi Hide Dan Show

Fungsi toggle

Tinggalkan Balasan