de.yml

title: Easings Cheat Sheet
description:
  Erstelle realistische Animationen, indem du die korrekte Übergangsfunktion
  auswählst.
share:
  Übergangsfunktionen (engl. easings) beschreiben den Geschwindigkeitsverlauf
  einer Animation, damit diese realistischer wirkt. Wenn Gegenstände in der
  echten Welt bewegt werden, haben sie ja auch nicht von Anfang an eine
  konstante Geschwindigkeit ohne Beschleunigungsphase.
  Diese Seite hilft dir, die richtige Übergangsfunktion auszuwählen.

about: !!format
  ~Übergangsfunktionen~ (engl. easing functions) beschreiben
  Animationsverläufe.

  Wenn man zum Beispiel eine Schublade öffnet, wird diese zuerst beschleunigt.
  Anschließend verzögern wir die Bewegung wieder. Lässt man einen
  Ball fallen, so beschleunigt dieser zunächst, und hüpft nach Auftreffen auf dem Boden
  noch ein paar mal herum.

  Diese Seite hilft dir, die richtige Übergangsfunktion auszuwählen.

easings:
  css: Überall verfügbar
  js: Nur in JavaScript

howtos:
  name: Name der Übergangsfunktion
  curve: Bézierkurve
  js: !!code
    jQuery mit dem ^jQuery Easing Plugin^ ist der einfachste Weg, eine Animation
    für Elemente zu erstellen. Der Name der Übergangsfunktion wird als
    3. Argument an die `.animate` Funktion übergeben.
  scss: !!code
    Sass/SCSS hilft dir, deine Animation kompakt zu beschreiben. Compass
    entfernt die Präfixe vor den Eigenschaften `transition` und `animation`.
    Die Compass-Erweiterung ^Compass Ceaser^ erlaubt, eine Animation per Namen
    auszuwählen oder die Bézierkurve zu definieren.
  css: !!code
    Die CSS Eigenschaften `transition` und `animation` erlauben es, die
    Übergangsfunktion festzulegen.
  css_bad:
    Leider werden nicht alle Übergänge in CSS unterstützt. Du kannst allerdings
    die Bézierkurve manuell in der Funktion festlegen.
  css_help:
    Wähle einen Übergang, um seine Beschreibung und seine Bézierkurve zu sehen.

easing:
  all_easings: Alle Übergange
  no_css: !!code
    Leider werden nicht alle Übergänge in CSS unterstützt. Allerdings kannst du
    JavaScript oder spezielle CSS Animation `@keyframes` verwenden.
  edit: ^Bearbeite^ auf cubic-bezier.com.

opensource:
  title: open source
  translate: ^Hilf beim Übersetzen^ dieser Seite