本文目录一览:
JS实现鼠标滑过链接改变网页背景颜色的方法
本文实例讲述了JS实现鼠标滑过链接改变网页背景颜色的方法。分享给大家供大家参考,具体如下:
这个小特效很不错,用链接改变网页背景色,鼠标放上链接文字上,网页背景就会跟着变换,想让你的主页更个性一点的朋友,这个代码一定能用上,其实你可在此基础上修改一下代码,改成鼠标放上文字切换样式表,这样整个网页就变了风格,是不是很实用?
运行效果截图如下:
在线演示地址如下:
具体代码如下:
html
head
title鼠标放上链接改变网页背景颜色/title
meta
http-equiv="Content-Type"
content="text/html;
charset=gb2312"
SCRIPT
LANGUAGE="JavaScript"
function
goHist(a)
{
history.go(a);
}
/script
/head
body
center
h2鼠标放到相应链接上看看!/h2
table
border=1
borderlight=green
style="border-collapse:
collapse"
cellpadding="5"
cellspacing="0"
trtd
align=center
a
href="#"
onMouseOver="document.bgColor='skyblue'"天空蓝/a
a
href="#"
onMouseOver="document.bgColor='red'"大红色/a
a
href="#"onMouseOver="document.bgColor='#0066CC'"清新蓝/a
/td/tr
/table
/center
/body
/html
希望本文所述对大家JavaScript程序设计有所帮助。
JS怎么改变背景颜色
1、首先我们来创建一个p元素,在里面写上hello:。
2、在浏览器界面上的显示如下。
3、接下来我们就为这个p元素来设置背景颜色。
4、接下来看看浏览器中变化。
5、说明我们就已经为p元素改好了背景色,如果要改变颜色的话直接在后面改就好。
JS点击更换网页背景颜色。
javascript脚本:
script type="text/javascript"
// 定义可换的颜色
var colors = ["#ff0000", "#00ff00", "#0000ff", "#ffff00", "#00ffff", "#ff00ff"];
var index = 0;
// 换色方法
function changeColor() {
// 获取颜色代码
var color = colors[index++];
// 更改文档的背景色
document.bgColor = color;
if (index == colors.length) {
index = 0;
}
}
/script
HTML代码:
input type="button" value="换色" onclick="changeColor();" /
怎样用js设置div的背景色
1、首先打dreamware软件,然后在 body中写入一个 div,把div赋予一个 id方便提取;
2、用css写div属性和初始的背景色,width宽度值;height高度值;background初始的背景色。
3、写进script标签,定义一个变量mydiv获取前面定义好的div。
4、然后用onmouseover事件,鼠标移动时触发事件,来控制鼠标在div时,背景色变为红色。
5、接着用onmouseout事件,鼠标离开元素时触发事件,来控制div背景色变为绿色,如图所示。