脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → JavaScript背景自动变色

JavaScript实现的背景自动变色代码

 更新时间：2015年10月17日 14:55:31   作者：秋雨  
这篇文章主要介绍了JavaScript实现的背景自动变色代码,涉及JavaScript数组操作结合定时函数实现修改页面元素样式的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了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程序设计有所帮助。

您可能感兴趣的文章:

相关文章

  • JS中filter( )数组过滤器的使用

    JS中filter( )数组过滤器的使用

    这篇文章主要介绍了filter() 数组过滤的使用方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2021-11-11
  • 微信小程序通过点击事件跨页面传参及data-方法传参（data-）的示例详解

    微信小程序通过点击事件跨页面传参及data-方法传参（data-）的示例详解

    在 vue 中，我们可以直接在点击事件中放入传递的参数进行传参；然而微信小程序中并不适用这样的写法，但是微信小程序可以通过自定义属性从而绑定参数使用，这篇文章主要介绍了微信小程序通过点击事件跨页面传参以及data-方法传参（data-）,需要的朋友可以参考下
    2023-12-12
  • 前端常用判断符号??，?. ，! ，!! ，|| ，&&，?:用法示例

    前端常用判断符号??，?. ，! ，!! ，|| ，&&，?:用法示例

    这篇文章主要给大家介绍了关于前端常用判断符号??,?. ,! ,!! ,|| ,&&,?:的相关资料, 在日常编写中,我们会频繁使用以下几个符号,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-03-03
  • 小程序实现五星点评效果

    小程序实现五星点评效果

    这篇文章主要为大家详细介绍了小程序实现五星点评效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-11-11
  • js验证手机号、密码、短信验证码代码工具类

    js验证手机号、密码、短信验证码代码工具类

    这篇文章主要介绍了js验证手机号、密码、短信验证码代码工具类，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-01-01
  • 详解JS WebSocket断开原因和心跳机制

    详解JS WebSocket断开原因和心跳机制

    这篇文章主要介绍了JS WebSocket断开原因和心跳机制，对websocket感兴趣的同学，可以参考下
    2021-05-05
  • js更优雅的兼容

    js更优雅的兼容

    对于JS框架开发中的客户端（浏览器）兼容难题，各位想必都不陌生。平常，我们都用if去面对接口不一致以及成堆的bug。然而，这里介绍的方法却可以让兼容更加优雅。
    2010-08-08
  • javascript实现的使用方向键控制光标在table单元格中切换

    javascript实现的使用方向键控制光标在table单元格中切换

    最近公司开发ERP项目，要求商品入库选择货架号时支持使用方向键快速选择，以提高入库效率。
    2010-11-11
  • Typescript中extends关键字的基本使用

    Typescript中extends关键字的基本使用

    extends表示具体的泛型类型只能是object类型,某个变量如果能断言成object类型[变量as object],那么这个变量的类型符合T extends object,下面这篇文章主要给大家介绍了关于Typescript中extends关键字基本使用的相关资料,需要的朋友可以参考下
    2022-08-08
  • 如何基于小程序实现发送语音消息及转文字功能

    如何基于小程序实现发送语音消息及转文字功能

    最近为小程序增加语音识别转文字的功能,坑路不断,特此记录,下面这篇文章主要给大家介绍了关于如何基于小程序实现发送语音消息及转文字功能的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-11-11

最新评论