Style visibility Property

Contoh

Menyembunyikan isi dari <p> elemen:

document.getElementById("myP").style.visibility = "hidden";

Definisi dan Penggunaan

Visibilitas set properti atau kembali apakah unsur harus terlihat.

Properti visibilitas memungkinkan penulis untuk menampilkan atau menyembunyikan elemen. Hal ini mirip dengan tampilan properti. Namun, perbedaannya adalah bahwa jika Anda mengatur display: none, ia menyembunyikan seluruh elemen, sementara visibility: hidden berarti bahwa isi dari elemen akan terlihat, tetapi elemen tetap dalam posisi dan ukuran aslinya.

Dukungan Browser

Properti visibilitas didukung di semua browser utama.

Sintaksis

Kembali properti visibility:

object .style.visibility

Mengatur properti visibility:

object .style.visibility="visible|hidden|collapse|initial|inherit"

Nilai properti

Nilai	Deskripsi
visible	Unsur terlihat. Ini adalah default
hidden	Unsur tidak terlihat, tapi masih mempengaruhi tata letak
collapse	Ketika digunakan pada baris tabel atau sel, elemen tidak terlihat (same as "hidden")
initial	Set properti ini ke nilai default. Baca tentang awal
inherit	Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi

Rincian teknis

Nilai default:	terlihat
Kembali Nilai:	Sebuah String, mewakili apakah isi dari elemen ditampilkan atau tidak
CSS Versi	CSS2

Contoh lebih

Contoh

Perbedaan antara properti display dan properti visibility:

function demoDisplay() {
document.getElementById("myP1").style.display = "none";
}

function demoVisibility() {
document.getElementById("myP2").style.visibility = "hidden";
}

Cobalah sendiri "

Contoh

Menyembunyikan dan menunjukkan <img> elemen:

function hideElem() {
document.getElementById("myImg").style.visibility = "hidden";
}

function showElem() {
document.getElementById("myImg").style.visibility = "visible";
}

Cobalah sendiri "