javascript实现随时变化着的背景颜色


Posted in Javascript onApril 02, 2015

很简单的一段背景颜色时刻发生变化的代码

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    #dv {width: 100px;height: 100px;}
  </style>
</head>
<script>
  window.onload=function(){
    var oDv = document.getElementById('dv');
      oDv.style.backgroundColor='red'
    setInterval(function(){
      var arrRandNumber = [
          getRandomNumber(0,255),
          getRandomNumber(0,255),
          getRandomNumber(0,255)   
        ];
 
      oDv.style.backgroundColor='rgb('+arrRandNumber[0]+','+arrRandNumber[1]+','+arrRandNumber[2]+')'
         
        function getRandomNumber(rMin,rMax){
          var cha = rMax-rMin;
          var rand = Math.random();
          //return (rMin+Math.round(cha*rand))
        }
       
    },500)
     
    //alert(getRandomNumber(0,255))
  };
</script>
<body>
  <div id="dv"></div>
</body>
</html>

以上所述就是本文给大家分享的全部内容了,希望能够对大家学习使用javascript有所帮助。

Javascript 相关文章推荐
javascript 文档的编码问题解决
Mar 01 Javascript
一次失败的jQuery优化尝试小结
Feb 06 Javascript
jquery实现图片灯箱明暗的遮罩效果
Nov 15 Javascript
jquery的父子兄弟节点查找示例代码
Mar 03 Javascript
使用Script元素发送JSONP请求的方法
Jun 12 Javascript
json实现添加、遍历与删除属性的方法
Jun 17 Javascript
AngularJS基础 ng-switch 指令简单示例
Aug 03 Javascript
微信小程序Server端环境配置详解(SSL, Nginx HTTPS,TLS 1.2 升级)
Jan 12 Javascript
jquery——九宫格大转盘抽奖实例
Jan 16 Javascript
socket.io与pm2(cluster)集群搭配的解决方案
Jun 02 Javascript
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 jQuery
JS pushlet XMLAdapter适配器用法案例解析
Oct 16 Javascript
javascript中call和apply的用法示例分析
Apr 02 #Javascript
原生js实现类似弹窗抖动效果
Apr 02 #Javascript
JavaScript显示表单内元素数量的方法
Apr 02 #Javascript
原创jQuery弹出层插件分享
Apr 02 #Javascript
JavaScript获取网页表单提交方式的方法
Apr 02 #Javascript
Javascript获取表单名称(name)的方法
Apr 02 #Javascript
如何改进javascript代码的性能
Apr 02 #Javascript
You might like
php创建sprite
2014/02/11 PHP
从新浪弄下来的全屏广告代码 与使用说明
2007/03/15 Javascript
指定js可访问其它域名的cookie的方法
2007/09/18 Javascript
基于jquery的图片懒加载js
2010/06/30 Javascript
juqery 学习之四 筛选查找
2010/11/30 Javascript
给超链接添加特效鼠标移动展示提示信息且随鼠标移动
2013/10/17 Javascript
jquery实现带二级菜单的导航示例
2014/04/28 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
Jquery easyui 实现动态树
2015/11/17 Javascript
js表单提交和submit提交的区别实例分析
2015/12/10 Javascript
AngularJS基础 ng-value 指令简单示例
2016/08/03 Javascript
Vue实现选择城市功能
2017/05/27 Javascript
EasyUI的TreeGrid的过滤功能的解决思路
2017/08/08 Javascript
JavaScript模块模式实例详解
2017/10/25 Javascript
图片懒加载imgLazyLoading.js使用详解
2020/09/15 Javascript
Javascript 编码约定(编码规范)
2018/03/11 Javascript
JS获取并处理php数组的方法实例分析
2018/09/04 Javascript
Websocket 向指定用户发消息的方法
2020/01/09 Javascript
Python基于Socket实现的简单聊天程序示例
2017/08/05 Python
python实现用户管理系统
2018/01/10 Python
python图书管理系统
2020/04/05 Python
python中pip的安装与使用教程
2018/08/10 Python
python字符串反转的四种方法详解
2019/12/02 Python
Python-openCV读RGB通道图实例
2020/01/17 Python
pyspark给dataframe增加新的一列的实现示例
2020/04/24 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
python excel多行合并的方法
2020/12/09 Python
Python如何使用神经网络进行简单文本分类
2021/02/25 Python
乌克兰数字设备、配件和智能技术的连锁商店:KTC
2020/08/18 全球购物
上海期货面试题
2014/01/31 面试题
什么是JNDI的上下文?如何初始化JNDI上下文
2012/03/10 面试题
法人委托书的范本格式
2014/09/11 职场文书
个人委托书如何写
2014/09/25 职场文书
2015年党风廉政建设工作总结
2015/04/09 职场文书
使用Selenium实现微博爬虫(预登录、展开全文、翻页)
2021/04/13 Python
Java实现学生管理系统(IO版)
2022/02/24 Java/Android