用JavaScript写出当鼠标悬停在按钮上时WEB页面从绿色变为红色,当鼠标移开时页面从红色变为蓝色的代码
4个回答
展开全部
<body bgcolor="green">
<input type=button value="我只是一个按钮" onMouseOver=document.bgColor="red"
onMouseOut=document.bgColor="blue">
onMouseOver即是鼠标经过时,onMouseOut即是鼠标离开时
再额外给你说个页面渐变的代码吧:
<script language="javascript">
rgb1=0;
rgb2=0;
rgb3=0;
rgb4=0;
rgb5=0;
rgb6=0;
function changeColor(){
if(rgb1<9){
rgb1++;
}
if(rgb2<9){
rgb2=rgb2+1;
}
if(rgb3<9){
rgb3++;
}
if(rgb4<9){
rgb4=rgb4+1;
}
if(rgb5<9){
rgb5++;
}
if(rgb6<9){
rgb6=rgb6+2;
}
document.bgColor="#"+rgb1+rgb2+rgb3+rgb4+rgb5+rgb6;setTimeout("changeColor()",1000)
}
changeColor()
document.fgColor="red";
</script>
<input type=button value="我只是一个按钮" onMouseOver=document.bgColor="red"
onMouseOut=document.bgColor="blue">
onMouseOver即是鼠标经过时,onMouseOut即是鼠标离开时
再额外给你说个页面渐变的代码吧:
<script language="javascript">
rgb1=0;
rgb2=0;
rgb3=0;
rgb4=0;
rgb5=0;
rgb6=0;
function changeColor(){
if(rgb1<9){
rgb1++;
}
if(rgb2<9){
rgb2=rgb2+1;
}
if(rgb3<9){
rgb3++;
}
if(rgb4<9){
rgb4=rgb4+1;
}
if(rgb5<9){
rgb5++;
}
if(rgb6<9){
rgb6=rgb6+2;
}
document.bgColor="#"+rgb1+rgb2+rgb3+rgb4+rgb5+rgb6;setTimeout("changeColor()",1000)
}
changeColor()
document.fgColor="red";
</script>
推荐于2018-04-14
展开全部
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
onload=function(){
var bodyElement = document.getElementById('body');
var buttonElement = document.getElementById('button');
buttonElement.onmouseover = function(){
bodyElement.setAttribute("style","background-color:red;");
}
buttonElement.onmouseout = function(){
bodyElement.setAttribute("style","background-color:yellow;");
}
}
</script>
</head>
<body id="body" style="background-color:blue;">
<button id="button">button</button>
</body>
</html>
<html>
<head>
<script type="text/javascript">
onload=function(){
var bodyElement = document.getElementById('body');
var buttonElement = document.getElementById('button');
buttonElement.onmouseover = function(){
bodyElement.setAttribute("style","background-color:red;");
}
buttonElement.onmouseout = function(){
bodyElement.setAttribute("style","background-color:yellow;");
}
}
</script>
</head>
<body id="body" style="background-color:blue;">
<button id="button">button</button>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
function make_red(){
document.bgColor="red"
}
function make_bule(){
document.bgColor="#0000FF"
}
<input type="button" mouseover="make_red()" mouseout="make_blue()" />
document.bgColor="red"
}
function make_bule(){
document.bgColor="#0000FF"
}
<input type="button" mouseover="make_red()" mouseout="make_blue()" />
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<body bgcolor="#00ff00">
<input type="button" id="btn" value="按钮" onmouseover="over();" onmouseout="out();" />
</body>
<script>
function over(){
document.bgColor = "#ff0000";
}
function out(){
document.bgColor = "#0000ff";
}
</script>
<input type="button" id="btn" value="按钮" onmouseover="over();" onmouseout="out();" />
</body>
<script>
function over(){
document.bgColor = "#ff0000";
}
function out(){
document.bgColor = "#0000ff";
}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询