Zyklisches Pulsieren von 3 Textzeilen

[stobi_de]

@Tommy:
Du hattest mal irgendwo so ein Javascript für Herzschlag eines Elementes.
Das wollte ich nun für 3 untereinanderliegende Textzeilen machen, dass die sich so nacheinander durchpulsieren.
Hast Du das noch irgendwo?

Frank

[Tommy Herrmann]

Moin,

gerade vom Einkauf zurück ...

... warte mal - muss es schnell raussuchen

[Tommy Herrmann]

Hier, auf einer meiner Testseiten. Das ist reines CSS (keine JavaScript dabei):

https://www.mobirise-tutorials.com/Test ... #Heartbeat


Anzeige:

Code: Alles auswählen

<div id="mybeat"></div>

CSS:

Code: Alles auswählen

@keyframes heartbeat {
  0% {
    transform: scale(0.75);
  }
  20% {
    transform: scale(1);
  }
  40% {
    transform: scale(0.75);
  }
  60% {
    transform: scale(1);
  }
  80% {
    transform: scale(0.75);
  }
  100% {
    transform: scale(0.75);
  }
}

#mybeat {
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  background-color: red;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid #232323;
  box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.6);
  animation: heartbeat 1s infinite;
}

[stobi_de]

merci (was für ein perfektes Französisch ich doch spreche )

[Tommy Herrmann]

Werner hat da auch so einiges:

https://werner-zenk.de/css/bild_mit_impuls.php

[stobi_de]

Für Effekthascherei mit Schrift finde ich dass hier vom Rudi Boegemanns schon ziemlich gut.
https://www.raketen-tanzgruppe.de/galer ... rneval.php

[Tommy Herrmann]

... ja - wer so etwas mag

Das erinnert mich an die "Glühende Neon Buchstaben" vom Werner:

https://werner-zenk.de/css/gluehende_ne ... staben.php

[Werner-Zenk.de]

Du hast mich auf die Idee gebracht mal wieder am "Glühende Neon Buchstaben" Generator zu arbeiten.
Und schwupps waren wieder einige Stunden des Urlaubes futsch

Neu hinzugekommen ist ein Hintergrundbild Farbverlauf, bei: "Hintergrund / Image +".
https://werner-zenk.de/tools/neon.php

[Tommy Herrmann]