本篇文章主要介绍怎么让js实现文字闪烁效果。在浏览网页时,偶尔会被闪动特效的文字吸引了目光。这样更能突出网站的重点,同时带来用户点击的高流量。其实我们用纯用css代码时很难实现文字不停闪动的效果,必须要结合js来操作。
这里给大家介绍一种非常简单的js实现文字闪烁的特效方法,即文字按照指定颜色逐次闪烁显示。
js实现文字闪烁的具体代码示例如下:
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>js文字闪烁效果</title>
<meta charset="UTF-8">
<style type="text/css">
</style>
</head>
<body>
<script language="javascript">
function changeColor(){
var color="#f00|#0f0|#00f|#880|#808|#088|yellow|green|blue|gray";
color=color.split("|");
document.getElementById("blink").style.color=color[parseInt(Math.random() * color.length)];
}
setInterval("changeColor()",200);
</script>
<div align="center">
<span id="blink">js实现文字闪烁示例</span>
</div>
</div>
</body>
</html>效果如下图:

立即学习“前端免费学习笔记(深入)”;
注:text-decoration 属性规定添加到文本的修饰。
text-decoration的值blink。IE、Chrome 或 Safari 均不支持 "blink" 属性值,也就是现在的主流的浏览器都是不支持该属性值的,仅仅支持火狐浏览器。所以想要实现 文字闪烁效果必须要结合js来实现。
以上就是怎么用css和js让页面文字出现不停闪烁的效果?(示例)的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号