鼠标样式及事件

1.使用css改变鼠标样式

style ="cursor:auto";

2.使用JS改变鼠标样式

document.getElementById('xxx').style.cursor="help";

3.使用jQuery设置鼠标样式

元素对象.css("cursor","not-allowed")

4.鼠标样式属性常用值：

auto          //标准光标
default       //标准箭头光标
pointer,hand  //手形光标
move          //移动光标
crosshair     //十字光标
all-scroll    //三角方向光标
text          //I字形光标
wait          //0等待光标
help          //帮助光标
not-allowed   //无效光标
no-drop       //不可拖动光标
vertical-text //水平I字形光标

5.鼠标事件

click      //鼠标单击事件
mousedown  //按下鼠标事件
mouseup    //松开鼠标事件
dblclick   //鼠标双击事件
mousemove  //鼠标移动事件
mouseout   //鼠标移出事件
mouseleave //鼠标离开事件
mouseenter //鼠标进入事件
mouseover  //鼠标进入事件

两个鼠标进入事件的触发时机：

mouseover:当鼠标移入元素或子元素都会触发事件。支持冒泡。
mouseenter:当鼠标移入元素才会触发事件。不支持冒泡。

mouseover以为支持冒泡，所以在子元素移动时会经常被触发，如果不希望被触发，就用 mouseenter，当没有子元素时，两个都可以用。