Wie erreiche ich einen Text-Flash-Effekt in js? (Bilder + Videos)-CSS-Kenntnisse-php.cn

Heim

tägliche Programmierung

CSS-Kenntnisse

Wie erreiche ich einen Text-Flash-Effekt in js? (Bilder + Videos)

藏色散人

Oct 18, 2018 am 09:38 AM

In diesem Artikel wird hauptsächlich die Verwendung von js zum Erzielen von Textflash-Effekten vorgestellt.

Im Prozess des Front-End-Seitendesigns kann das Hinzufügen einiger dynamischer Spezialeffekte den Inhalt der Website offensichtlich reicher und schöner machen und die Aufmerksamkeit der Benutzer auf sich ziehen.

Für Front-End-Neulinge kann es schwierig sein, mit js einige Spezialeffekte zu implementieren, aber eigentlich ist es sehr einfach.

Im Folgenden stellen wir Ihnen anhand eines einfachen Codebeispiels die Spezialeffektmethode von js vor, um das Blinken von Text zu erreichen . [Weitere js-Spezialeffekte finden Sie in der Spalte js-Spezialeffektcode-Download zum Anzeigen]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js实现文字闪烁特效</title>
</head>
<body>
<div id="blink">PHP中文网</div>
</body>
<script language="javascript">
    function changeColor() {
        var color = [&#39;#F96&#39;,&#39;#cc6&#39;];
        // parseInt 将字符串类型转换为整型  random 获取0-1之间的随机数   color.length color数组的长度
 document.getElementById("blink").style.color = color[parseInt(Math.random() * color.length)];
    }
    // 执行定义好的changeColor方法，200毫秒执行一下
 setInterval("changeColor()", 200);
</script>
<style>
    * {
        color: #CC6
 }
</style>
</html>

Nach dem Login kopieren

Der endgültige Effekt ist wie folgt:

Wie erreiche ich einen Text-Flash-Effekt in js? (Bilder + Videos)

In diesem Artikel geht es um die js-Methode zum Erzielen eines Text-Flashing-Effekts. Er ist auch sehr einfach und leicht zu verstehen.

Weitere coole Javascript-Spezialeffektcodes finden Sie unter: Javascript-Spezialeffektsammlung

Wenn Sie mehr über Frontend-bezogenes Wissen erfahren möchten, können Sie dem PHP folgen Chinesische WebsiteJavaScript-Video-Tutorials, HTML-Video-Tutorials, CSS-Video-Tutorials, Bootstrap-Video-Tutorials und andere verwandte Tutorials, alle sind herzlich willkommen, sich darauf zu beziehen zu und lernen!

Das obige ist der detaillierte Inhalt vonWie erreiche ich einen Text-Flash-Effekt in js? (Bilder + Videos). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn