JavaScript实现网页背景自动变色功能
作者:异步漫步时间:2026-10-29 15:34:15浏览:73
本文介绍了使用JavaScript实现网页背景颜色自动切换的方法。通过定义颜色数组并利用setTimeout函数定时调用,可设定切换频率与颜色列表,实现背景色的自动循环变化,适用于简单的页面动态效果展示。
JavaScript背景自动变色实现
本文介绍了一段使用JavaScript编写的背景自动变色示例代码,供读者参考学习。
该示例展示了如何实现网页背景颜色的自动轮播。用户只需指定颜色数组及切换间隔时间,系统即可在设定时间内自动循环切换背景色。
运行效果如下图所示:

在线演示地址如下:
http://demo.jb51.net/js/2015/js-auto-cha-bg-color-demo/
具体代码实现如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>背景自动变色</title>
</head>
<body>
背景自动变色
<script language="javascript">
var Arraycolor=new Array("#00FF66","#FFFF99","#99CCFF","#FFCCFF","#FFCC99","#00FFFF","#FFFF00","#FFCC00","#FF00FF");
var n=0;
function turncolors(){
n++;
if (n==(Arraycolor.length-1)) n=0;
document.bgColor = Arraycolor[n];
setTimeout("turncolors()",1000);
}
turncolors();
</script>
</body>
</html>
希望本文所述内容对JavaScript程序设计有所帮助。
作者最新文章
D3.js 比例尺与坐标轴的配置详解
2026-11-05 16:54:46
JavaScript怎么遍历对象的Symbol键和不可枚举属性
2026-11-05 13:13:39
封装一个健壮的JS字符串判空工具函数
2026-11-05 12:16:14
JavaScript合并数组的三种常用方法:concat、扩展运算符与push
2026-11-05 11:22:29
JavaScript立即执行函数(IIFE)是什么及基本语法
2026-11-05 10:51:19
