JS实现在页面随时自定义背景颜色的方法


Posted in Javascript onFebruary 27, 2015

本文实例讲述了JS实现在页面随时自定义背景颜色的方法。分享给大家供大家参考。具体实现方法如下:

<HTML>

<HEAD>

<TITLE>JS实现在页面随时自定义背景颜色</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

//以下代码将输入框及其所在的层写进窗口。

document.writeln('<div align="center" id=bgcolortestdiv style="BACKGROUND-COLOR: gray;POSITION: absolute;width: 200; height: 70; top=100; Z-INDEX: 100" >');

document.writeln('<p><B><font size=2>输入颜色代码<br>可以即时改变背景色</font></b></p>');

document.writeln('<p><input type="text" name="text" onkeyup="cbgcolor(this.value)"></p>');

document.writeln('</div>');

function cbgcolor(color){   //change background color

 if (color != '')

 document.bgColor=(''+color+'');  //设置背景颜色

}

function keepdivpos(){    //keep div position

document.all.bgcolortestdiv.style.pixelTop=parseInt(document.body.scrollTop)+100 //计算并设置层的相对位置

}

setInterval('keepdivpos()',100)   //设定自动改变层位置的时钟。

// End -->

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JS动态创建Table,Tr,Td并赋值的具体实现
Jul 05 Javascript
javaScript arguments 对象使用介绍
Oct 18 Javascript
JS实现图片放大镜效果的方法
Feb 27 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
Aug 02 Javascript
深入浅出ES6之let和const命令
Aug 25 Javascript
js实现文字截断功能
Sep 14 Javascript
domReady的实现案例
Nov 23 Javascript
AngularJS中的拦截器实例详解
Apr 07 Javascript
JavaScrpt的面向对象全面解析
May 09 Javascript
vue脚手架搭建项目的兼容性配置详解
Jul 17 Javascript
javascript设计模式 ? 享元模式原理与用法实例分析
Apr 15 Javascript
vue tab滚动到一定高度,固定在顶部,点击tab切换不同的内容操作
Jul 22 Javascript
JQuery中绑定事件(bind())和移除事件(unbind())
Feb 27 #Javascript
Jquery中Event对象属性小结
Feb 27 #Javascript
jQuery中hover方法和toggle方法使用指南
Feb 27 #Javascript
JS实现往下不断流动网页背景的方法
Feb 27 #Javascript
jQuery+easyui中的combobox实现下拉框特效
Feb 27 #Javascript
asp.net+js实现金额格式化
Feb 27 #Javascript
JavaScript检测浏览器cookie是否已经启动的方法
Feb 27 #Javascript
You might like
PHP请求远程地址设置超时时间的解决方法
2016/10/29 PHP
javascript 获取元素位置的快速方法 getBoundingClientRect()
2009/11/26 Javascript
避免回车键导致的页面无意义刷新的解决方法
2011/04/12 Javascript
juery框架写的弹窗效果适合新手
2013/11/27 Javascript
JS获取节点的兄弟,父级,子级元素的方法
2014/01/09 Javascript
js输出阴历、阳历、年份、月份、周示例代码
2014/01/29 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
2014/12/15 Javascript
jQuery常用数据处理方法小结
2015/02/20 Javascript
js实现功能比较全面的全选和多选
2017/03/02 Javascript
angularjs实现柱状图动态加载的示例
2017/12/11 Javascript
JavaScript门道之标准库
2018/05/26 Javascript
基于 jQuery 实现键盘事件监听控件
2019/04/04 jQuery
解决ant-design-vue中menu菜单无法默认展开的问题
2020/10/31 Javascript
python将unicode转为str的方法
2017/06/21 Python
Python实现爬虫设置代理IP和伪装成浏览器的方法分享
2018/05/07 Python
Django学习教程之静态文件的调用详解
2018/05/08 Python
transform python环境快速配置方法
2018/09/27 Python
Python实现基于SVM的分类器的方法
2019/07/19 Python
python分布式计算dispy的使用详解
2019/12/22 Python
Python 实现Image和Ndarray互相转换
2020/02/19 Python
python实现PDF中表格转化为Excel的方法
2020/06/16 Python
如何使用pycharm连接Databricks的步骤详解
2020/09/23 Python
python制作一个简单的gui 数据库查询界面
2020/11/19 Python
Python如何telnet到网络设备
2021/02/18 Python
HTML5 Canvas中绘制椭圆的4种方法
2015/04/24 HTML / CSS
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
英国在线电子和小工具商店:TecoBuy
2018/10/06 全球购物
求职简历中个人的自我评价
2013/12/25 职场文书
幼儿教师师德师风自我剖析材料
2014/09/29 职场文书
违反单位工作制度检讨书
2014/10/25 职场文书
2014年班主任德育工作总结
2014/12/05 职场文书
酒店服务员岗位职责
2015/02/09 职场文书
学校党支部公开承诺书
2015/04/30 职场文书
幼儿园家长反馈意见
2015/06/03 职场文书
工作感想范文
2015/08/07 职场文书
Oracle中DBLink的详细介绍
2022/04/29 Oracle