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

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

藏色散人

Freigeben： 2019-11-30 16:39:05

Original

7798 Leute haben es durchsucht

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!