Wie man Text auf meiner Webseite blinken lässt

Frühere Versionen von HTML und Internetbrowsern unterstützten das -Tag. Es wurde verwendet, um blinkenden Text auf Webseiten zu erstellen. Heute ist dieses Tag veraltet und wird von keinem größeren Browser mehr unterstützt. Um blinkenden Text zu erstellen, verwenden Sie entweder das folgende CSS- oder JavaScript-Beispiel.

CSS-Beispiel

Um eine CSS-Blink-Klasse zu erstellen, kopieren Sie den folgenden CSS-Code in den Kopf Ihrer Webseite.

<style type="text/css">
<!--
/* @group Blink */
.blink {
 -webkit-animation: blink .75s linear infinite;
 -moz-animation: blink .75s linear infinite;
 -ms-animation: blink .75s linear infinite;
 -o-animation: blink .75s linear infinite;
 animation: blink .75s linear infinite;
}
@-webkit-keyframes blink {
 0% { opacity: 1; }
 50% { opacity: 1; }
 50.01% { opacity: 0; }
 100% { opacity: 0; }
}
@-moz-keyframes blink {
 0% { opacity: 1; }
 50% { opacity: 1; }
 50.01% { opacity: 0; }
 100% { opacity: 0; }
}
@-ms-keyframes blink {
 0% { opacity: 1; }
 50% { opacity: 1; }
 50.01% { opacity: 0; }
 100% { opacity: 0; }
}
@-o-keyframes blink {
 0% { opacity: 1; }
 50% { opacity: 1; }
 50.01% { opacity: 0; }
 100% { opacity: 0; }
}
@keyframes blink {
 0% { opacity: 1; }
 50% { opacity: 1; }
 50.01% { opacity: 0; }
 100% { opacity: 0; }
}
/* @end */
-->
</style>

Sobald der obige CSS-Code eingefügt ist, können Sie die Klasse „blink“ für jedes Element verwenden. Unten sehen Sie ein Absatz-Tag, das die Blink-Klasse verwendet.

<p class="tab blink">example of blinking text using CSS.</p>

Wenn Sie alle oben genannten Schritte befolgen, erhalten Sie einen blinkenden Text, wie unten gezeigt.

Beispiel für blinkenden Text mit CSS.

JavaScript-Beispiel

Um eine JavaScript-Blinkfunktion zu erstellen, kopieren Sie den folgenden JavaScript-Code in den Kopf Ihrer Seite.

<script>
function blinker() {
 $('.blinking').fadeOut(500);
 $('.blinking').fadeIn(500);
}
setInterval(blinker, 1000);
</script>

Sobald das obige JavaScript in Ihre Seite eingefügt wurde, können Sie die Funktion aufrufen, indem Sie die Klasse „blinken“ zu einem beliebigen Element hinzufügen. Unten ist ein Absatz-Tag, das die blinkende Klasse verwendet.

<p class="blinking">Example of blinking text using JavaScript.</p>

Wenn Sie alle oben genannten Schritte befolgen, erhalten Sie einen blinkenden Text, wie unten gezeigt. Sie können die Werte im JavaScript anpassen, um das Aussehen des blinkenden Textes zu ändern.

Beispiel für blinkenden Text mit JavaScript.