Style visibility Property

Exemple

Masquer le contenu d'un <p> élément:

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

Définition et utilisation

Les ensembles de propriétés de visibilité ou rendement si un élément doit être visible.

La propriété de visibilité permet à l'auteur pour afficher ou masquer un élément. Il est similaire à l' écran la propriété. Cependant, la différence est que si vous définissez display: none, il cache l'élément entier, tandis que visibility: hidden signifie que le contenu de l'élément sera invisible, mais l'élément reste dans sa position initiale et la taille.

Support du navigateur

La propriété de visibilité est pris en charge dans tous les principaux navigateurs.

Syntaxe

Retour la propriété de visibilité:

object .style.visibility

Définissez la propriété de visibilité:

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

Valeurs de propriété

Valeur	La description
visible	L'élément est visible. Ce défaut est
hidden	L'élément n'est pas visible, mais affecte encore la mise en page
collapse	Lorsqu'il est utilisé sur une ligne de la table ou de la cellule, l'élément ne soit pas visible (same as "hidden") le (same as "hidden")
initial	Définit cette propriété à sa valeur par défaut. Lisez à propos initial
inherit	Hérite cette propriété de son élément parent. En savoir plus sur hériteront

Détails techniques

Valeur par défaut:	visible
Valeur de retour:	Une chaîne, indiquant si le contenu d'un élément est affiché ou non
version CSS	CSS2

autres exemples

Exemple

La différence entre la propriété d'affichage et la propriété de visibilité:

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

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

Essayez vous - même »

Exemple

Masquer et afficher un <img> élément:

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

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

Essayez vous - même »