Home >Daily Programming >CSS Knowledge >How to achieve text flashing effect in js? (Pictures + Videos)
This article mainly introduces how to use js to achieve text flashing effects.
In the process of front-end page design, adding some dynamic special effects can obviously make the website content richer, more beautiful, and attract users' attention.
For front-end novices, it may be difficult to use js to implement some special effects, but it is actually very simple.
Below we will introduce to you the special effect method of js to achieve text flashing through a simple code example. [For more js special effects, you can visit the js special effects code download column to view]
<!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 = ['#F96','#cc6'];
// 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>The final effect is as follows:
This article is an introduction to the method of js to achieve text flashing effect. It is also very simple and easy to understand. I hope it will be helpful to friends in need!
More cool javascript special effects codes, all in: javascript special effects encyclopedia
If you want to know more about front-end related knowledge, you can follow the PHP Chinese websiteJavaScript Video tutorial, HTML video tutorial, CSS video tutorial, Bootstrap video tutorial and other related tutorials, welcome everyone to refer to and learn!
The above is the detailed content of How to achieve text flashing effect in js? (Pictures + Videos). For more information, please follow other related articles on the PHP Chinese website!