Language: HTML | XAML

Animieren von Ein- und Ausblendungen (HTML)

Applies to Windows and Windows Phone

Verwenden Sie Ein- und Ausblendungsanimationen, um Elemente sichtbar zu machen oder aus der Ansicht zu entfernen. Es gibt drei Arten von Ein- und Ausblendungsanimationen: Einblenden, Ausblenden und Überblenden. Jede Animation ist für ein anderes Szenario gedacht.

Dieser Satz von Animationen umfasst die folgenden Funktionen:

Das folgende Video zeigt die Animationen, mit denen Inhalt ein- und ausgeblendet wird. Achten Sie auf die Bildlaufleiste am unteren Bildschirmrand, die ein- und ausgeblendet wird:

Das folgende Video zeigt die Überblendungsanimation:

|

Einblenden

Verwenden Sie die Einblendungsanimation, um ein Element oder einen Satz von Elementen anzuzeigen. Ein Beispiel für die Einblendungsanimation sehen Sie auf der App-Leiste, auf der aufgrund von Benutzerinteraktionen neue Steuerelemente angezeigt werden können. Sie sollten die Einblendungsanimation auch verwenden, um beim dynamischen Laden des Inhalts von einem Platzhalterelement zum tatsächlichen Element überzugehen oder um eine benutzerdefinierte QuickInfo oder ein benutzerdefiniertes Dialogsteuerelement anzuzeigen.

Die Windows-Steuerelemente für QuickInfos und Dialogfelder enthalten die Ein- und Ausblendungsanimationen.

Ausblenden

Verwenden Sie die Ausblendungsanimation, um ein Element oder einen Satz von Elementen aus der Ansicht zu entfernen. Ein Beispiel für die Ausblendungsanimation sehen Sie in vorübergehend angezeigten Steuerelementen wie beispielsweise der Bildlaufleiste oder der Schwenkmarkierung. Diese werden nach einer gewissen Zeit ausgeblendet, wenn keine Benutzereingabe erkannt wurde.

Überblenden

Verwenden Sie die Überblendungsanimation, um ein vorhandenes Element direkt durch ein eingehendes Element zu ersetzen. Die Animation blendet die vorhandenen Elemente aus und blendet dabei an der gleichen Stelle die Ersatzelemente ein.

Weitere Ressourcen

Codebeispiele, die die Verwendung der Funktionen von Ein- und Ausblendungsanimationen verdeutlichen, finden Sie im HTML-Beispiel für die Animationsbibliothek.

Bewährte Methoden für den Entwurf bei der Verwendung dieser Animationen finden Sie unter Richtlinien und Prüfliste für Ein- und Ausblendungsanimationen.

Verwandte Themen

Animieren der Benutzeroberfläche
fadeIn
fadeOut
crossFade

 

 

Anzeigen:
© 2015 Microsoft