cursor使用

前言

日常积累，欢迎指正

corsor

用于指定 dom 上的鼠标效果

cursor默认可选值

• default 默认光标（通常是一个箭头）
• auto 默认。浏览器设置的光标。
• crosshair 光标呈现为十字线。
• pointer 光标呈现为指示链接的指针（一只手）
• move 此光标指示某对象可被移动。
• re-resize 此光标指示矩形框的边缘可被向右（东）移动。
• ne-resize 此光标指示矩形框的边缘可被向上及向右移动（北/东）。
• nw-resize 此光标指示矩形框的边缘可被向上及向左移动（北/西）。
• n-resize 此光标指示矩形框的边缘可被向上（北）移动。
• se-resize 此光标指示矩形框的边缘可被向下及向右移动（南/东）。
• sw-resize 此光标指示矩形框的边缘可被向下及向左移动（南/西）。
• s-resize 此光标指示矩形框的边缘可被向下移动（南）。
• w-resize 此光标指示矩形框的边缘可被向左移动（西）。
• text 此光标指示文本。
• wait 此光标指示程序正忙（通常是一只表或沙漏）。
• help 此光标指示可用的帮助（通常是一个问号或一个气球）。

点击这里查看预览效果

使用简例

/**
* 设置默认样式
*/
Object.style.cursor='value'

/**
* 设置自定义样式
* 当 url 指定的图片找不到时使用 auto 的效果
*/
Object.style.cursor='url(imgPath), auto'

应用