在html中,元素可用onclick、ondblclick、onmouseover、onmouseout、onmousedown、onmouseup、onmousemove来对鼠标的各种事件进行响应。本例演示了鼠标对元素的单击、双击、悬停、移走、按下、松开、在元素内的移动来更改元素的背景色。 eg:
#container{
width: 570px;
height: 200px;
}
dl{
float: left;
}
dt{
width: 90px;
height: 90px;
background-color: lightblue;
border-radius: 20px;
margin: 10px;
}
.yellow{
background-color: lightgoldenrodyellow;
}
.blue{
background-color: lightblue;
}
单击
双击
悬停
按下
移动
var num1=0,num2=0;
function f1(e){
num1++;
if(num1%2==0)
e.className="blue";
else
e.className="yellow";
}
function f2(e){
num2++;
if(num2%2==0)
e.className="blue";
else
e.className="yellow";
}
function mouseMove(ev){
ev=ev||window.event;
var el=document.getElementById("ele");
var x=ev.clientX-el.offsetLeft;
var y=ev.clientY-el.offsetTop;
if(x |