Je travaille avec la méthode JQuery Fadein / Fadeout et confondue par exactement ce qu'elle fait. Les DOCS indiquent que la méthode affecte la propriété d'opacité de l'élément mais l'affichage: Aucun ne fonctionne également pas pour masquer un élément, puis la fonduer. Sont opacité: 0 et affichage: Aucune de la même chose? Je vois des animations vraiment agitées en utilisant les méthodes et je veux mieux comprendre ce qui se passe.
7 Réponses :
Affichage: Aucun laisse disparaître l'élément. Tout comme ça n'est pas présent. Cela signifie que votre mise en page peut changer.
opacité: 0 celui-ci fait simplement votre élément invisible. Cela ne prend aucun effet sur votre mise en page.
opacité: 0 permettra toujours de cliquer, de survoler et d'autres événements de souris sur l'élément. Il ne sera tout simplement pas visible pour l'utilisateur.
Affichage: Aucun fait ce qu'il implique - l'élément existe toujours mais n'est pas complètement visible, comme si ce n'est pas largeur et hauteur est 0 .
opacité affecte la transparence de l'objet.
Affichage affecte la manière dont l'objet est rendu dans le navigateur Web.
Par exemple: P>
This text is here! <div style="display:none"> This text will be invisible </div> this text will be here
En plus de la réponse de @ arminb (je ne peux pas simplement commenter sur elle) Display: Aucun ne fonctionnera dans tous les navigateurs (vaguement modernes), Opacité: 0 a un soutien flaky chez les navigateurs plus anciens (ne fonctionne pas dans IE6, 7 ou 8)
Si vous avez besoin d'une opacité, quelque chose comme ça devrait fonctionner dans tous: mais c'est désordre. Affichage: Aucun est la solution la plus propre qui fonctionnera. Visibilité: Caché fonctionnera également dans plus de navigateurs que d'opacité et réalise le même objectif (c'est-à-dire invisible, mais la laisse là-bas)
Affichage: Aucun est comme un objet a été supprimé de la page, Opacité: 0 ou Visibilité: Aucun Gardez les deux à la fois page mais rend tout simplement clair et laisse un espace vide où c'était. Quand c'est opacité: 0 Vous pouvez toujours cliquer dessus, mais je ne pense pas la même chose pour la visibilité: Aucun.
Ils feront tous les deux le texte invisible, mais Par exemple. << affichera comme c'est le texte affichera comme ceci est le texte Ceci est Plus de texte sens? Affichage: Aucun; Ça va ressembler à ce qu'il n'existait jamais, où opacité: 0.0; Filtre: alpha (opacité = 0); va ressembler à quelque chose est simplement manquant. Affichage: Aucun;
C'est plus de texte
opacité: 0.0; Filtre: alpha (opacité = 0);
Les deux cas rendent l'élément invisible, mais Permettez-moi d'ajouter un troisième qui est pertinent dans ce contexte:
J'ai fait une démo jsfiddle ici: http://jsfiddle.net/sebastien_worms/tcbjd/
opacité: 0 : invisible , mais prend l'espace d'affichage (affectez la mise en page) et Affichage: Aucune :
Visibilité: Hidden : Invisible ,
... Peut-être que ce n'est pas vraiment correct, car le DOM n'est pas sur l'affichage si je comprends correctement. Merci de me faire remarquer l'erreur, je modifie le post.