2016-12-21 6 views
0

Ich habe ein externes Eltern-Div mit zwei untergeordneten Divs. Ich möchte beide untergeordneten divs ausblenden, bis der Benutzer zu einem bestimmten Abschnitt der Seite scrollt. An diesem Punkt werden die divs eingeblendet. Wie kann ich das übergeordnete div beibehalten, wenn das Sichtbarkeitsattribut der interior divs festgelegt ist? versteckt?Übergeordnetes Div beibehalten Originalgröße beibehalten, wenn interne Divs ausgeblendet werden

+2

Wenn Sie 'visibility: hidden' verwenden, bleibt die Größe erhalten. Nur wenn Sie 'display: none' verwenden, variiert die Größe. –

Antwort

1
visibility:hidden 

Das HTML-Element nimmt Platz, ist aber nicht sichtbar. Das Element ist sozusagen transparent.

display:none 

Das HTML-Element hält seinen Platz nicht und ist nicht sichtbar.

Sichtbarkeit: versteckt ist wahrscheinlich das, was Sie wollen

+0

Ich habe festgestellt, dass mein Problem etwas völlig anderes ist. Wenn ich die divs ausblenden will, verstecke ich sie zuerst und rufe dann die Funktion fadeIn() auf. Dieser Aufruf, sich zu verstecken, verursacht jedoch seltsames Verhalten, und das verursachte Probleme. –

1

Bishal richtig ist, ein weiterer Ansatz, die Sie verwenden können, ist die Opazität Eigenschaft zu animieren und in beiden Fällen (entweder Sichtbarkeit oder Opazität verwendet wird), können Sie ein Set Animation der Fade-in-Effekt zu erzeugen:

die CSS:

.element { 
    opacity: 0; 
    transition: all 1s ease-in-out; 
} 

Dann können Sie gezielt Ihre .element blättern Sie mit JS und setzen Sie die Deckkrafteigenschaft auf 1 (die Übergangseigenschaft stellt die Einblendung sicher).

Verwandte Themen