Dies ist mit der CSS-Animation und der Eigenschaft forwards möglich, um die Animation bei 100% anzuhalten. Die Eigenschaft display kann nicht animiert werden.
Das Element erhält position: relative und dann opacity: 0 und left: -9999px , wenn es 100% erreicht. Es wird verblassen und sich dann außerhalb des Ansichtsfensters bewegen.
Siehe Browser-Unterstützung hier - Kompatibel IE 10+!
Hier finden Sie eine vollständige Liste der animierten Eigenschaften.
Hier sind drei Möglichkeiten, das div um 100% außerhalb des Darstellungsbereichs zu ziehen:
left: -9999px kombiniert mit position: relative für das Element (wie im folgenden Beispiel)
height: 0 oder max-height: 0 kombiniert mit text-indent: -9999px
In diesem Beispiel wird der Text nach 5 Sekunden ausgeblendet und das div dann aus dem Ansichtsfenster entfernt.
Am nächsten kommst du mit css nur ist das .. es könnte weiter verbessert werden, aber so wie es ist ..
%Vor%Und wenn du mit javascript / jquery machen willst ..
Sie würden dies tun ..
%Vor%