Properti style.visibility digunakan untuk menetapkan apakah elemen ini kelihatan atau tidak.
Sintaks:
obj.style.visibility = value;
Nilainya:
collapse
Jika digunakan untuk cell-cell di dalam elemen TABLE,collapsemempunyai fungsi yang sama sepertihidden.hidden
Ketika properti ini di set kenilaihiddenfungsinya hampir sama seperti style.display = "none", yaitu akan menyembunyikan elemen. Bedanya, properti ini masih tetap mempertahankan posisi dan ukuran asli dari elemen itu, jadi masih berpengaruh terhadap layout, sedangstyle.display="none"tidak.Contoh:
<HTML> <HEAD> <SCRIPT TYPE="text/javascript"> function hiddenVal() { var x = document.getElementById("x"); x.style.visibility = "hidden"; } function noneOfDisplay() { var x = document.getElementById("x"); x.style.display = "none"; } </SCRIPT> </HEAD> <BODY> <H1 ID="x">Haloooo...</H1> <BUTTON TYPE="button" ONCLICK="hiddenVal()">style.visibility="hidden"</BUTTON> <BUTTON TYPE="button" ONCLICK="noneOfDisplay()">style.display="none"</BUTTON> </BODY> </HTML>visible
Nilai ini kebalikannyahidden, yaitu untuk menampilkan isi dari elemen yang sebelumnya terkena pengaturanstyle.visibility="hidden".Contoh:
<HTML> <HEAD> <SCRIPT TYPE="text/javascript"> window.onload = function() { var x = document.getElementById("x"); x.style.visibility = "hidden"; } function Show() { var x = document.getElementById("x"); x.style.visibility = "visible"; } </SCRIPT> </HEAD> <BODY> <H1 ID="x">Haloooo...</H1> <BUTTON TYPE="button" ONCLICK="Show()">Tampilkan!</BUTTON> </BODY> </HTML>inherit
