Killua: CSS Animation

Beitrag lesen

CSS-Animationen starten mit dem Laden des Dokuments:

.animiert  {
  animation: orbit 12s infinite linear;
}

das habe ich nicht hinbekommen

oder, wenn Du mit :hover oder :focus etwas auslöst:

.animiert:hover  {
  animation: orbit 12s infinite linear;

das schon

Wenn Du willst, dass Maushover überall wirkt, musst du das :hover auf den body setzen:

body: hover .animiert  {
  animation: orbit 12s infinite linear;

Klar, oder halt irgendeinen größeren Bereich.

Aber die Frage ist 1. wie man das ohne diesen Trick automatisch und nachhaltig starten kann. Nur wie es aussieht, kann ich es nur mit :hover o.ä., egal ob transform oder animate starten. Automatisch tuts sich garnix.

Nur mit @keyframes, ja das startet sofort.

Egal, nicht so wichtig, war nur eine Nachfrage.

Das mit dem :hover ist aber ne Krücke. Touchgeräte haben gar kein :hover und manche mögen das hektische Gezuckel gar nicht.

Wie im Startpost gesagt, ich setze das nicht wirklich wo ein, ist nur Spielerei

Was ich aber gerne habe, sind eben Parallax Effekte - das gefällt mir sehr. Doch animieren brauche ich nicht wirklich. Es ist aber interessant, was man mit CSS alleine alles machen kann, wo früher Flash oder seitenweise JS nötig war: Heute in paar CSS Anweisungen, fertig. "Faszinierend"

0 67

CSS Animationen kombinieren

Killua
  • css
  1. 0

    CSS-Transformationen kombinieren

    Gunnar Bittersmann
    1. 0
      Rolf B
      1. 0
        Killua
        1. 0
          Matthias Scharwies
          1. 0
            Killua
            1. 0
              Matthias Scharwies
              1. 0
                meltemi
                1. 0
                  Matthias Scharwies
                  1. 0
                    Killua
              2. 0
                Killua
            2. 0
              Der Martin
              1. 0
                Killua
                1. 0
                  Der Martin
                2. 0
                  Gunnar Bittersmann
                  • menschelei
                  • rechtschreibung
                  1. 0
                    Killua
                    1. 0
                      Auge
                      1. 0
                        Tabellenkalk
                        1. 0
                          MudGuard
                        2. 0
                          Gunnar Bittersmann
                          1. 0
                            Gunnar Bittersmann
                            • menschelei
                            • musik
                            • rechtschreibung
                            1. 0
                              Gunnar Bittersmann
                              1. 1
                                Rolf B
                3. 0
                  Rolf B
          2. 1
            Rolf B
            1. 0
              Matthias Scharwies
            2. 0
              Killua
              1. 0
                Rolf B
                1. 0
                  Killua
          3. 0

            Neustart Transform-Tutorial

            Matthias Scharwies
            1. 0
              Matthias Scharwies
            2. 1
              Matthias Scharwies
            3. 0
              Matthias Scharwies
              1. 0
                Rolf B
                1. 0
                  Matthias Scharwies
                  1. 0
                    Matthias Scharwies
                    1. 0
                      Der Martin
                      1. 0
                        Matthias Scharwies
                        1. 0
                          Rolf B
                          1. 0
                            Der Martin
                            1. 0
                              Rolf B
                              1. 0
                                Der Martin
                                1. 0
                                  Gunnar Bittersmann
                                  • geometrie
                                  • svg
                                  1. 0
                                    Matthias Scharwies
                                    1. 0

                                      Transform-Tutorial aktualisiert

                                      Matthias Scharwies
                          2. 0
                            Gunnar Bittersmann
                            • css
                            • programmiertechnik
                            1. 0
                              Rolf B
                              1. 0
                                Gunnar Bittersmann
    2. 0
      Killua
      1. 0
        Gunnar Bittersmann
        1. 0
          Killua
    3. 0
      Killua
      1. 0
        Rolf B
        1. 0
          Killua
          1. 0
            Killua
  2. 0
    Killua
    1. 0
      Killua
    2. 0

      CSS Animation

      Matthias Scharwies
      • animation
      • css
      1. 0
        Killua
        1. 0
          Matthias Scharwies
    3. 0
      T-Rex
      1. 0
        Rolf B
        1. 0
          Gunnar Bittersmann
          1. 0
            Rolf B
      2. 0
        Killua
        1. 0
          T-Rex
          1. 0
            Killua