cursor 状态 总结 this.style.cursor

时间：2023-01-21 20:49:15

使用

1、
<STYLE>
P { cursor : hand; }
</STYLE>
2、
<STYLE>
oBox.style.cursor = "url(" + Some_Uniform_Resource_Identifier + ")";
</STYLE>
3、
<P onmouseover="this.style.cursor='hand'">
4、js   wraper为某对象ID
$("wraper").style.cursor='wait';

例子 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <STYLE>
	/*P { cursor : hand; }*/
	oBox.style.cursor = "url(" + Some_Uniform_Resource_Identifier + ")";
  </STYLE>
 </HEAD>
 
 <BODY>
  <p>
  /*正常鼠标 */
	cursor:auto; 
	/*十字鼠标 */
	cursor:crosshair;
	/*默认鼠标 */
	cursor:default;
	/*手*/
	cursor:pointer;
	/*移动鼠标 */
	cursor:move; 
	/*改变大小鼠标 */
	cursor:e-resize,ne-resize,nw-resize,n-resize,se-resize,sw-resize,s-resize,w-resize;
	/*文字鼠标 */
	cursor:text; 
	/*等待鼠标 */
	cursor:wait; 
	/*求助鼠标 */
	cursor:help;
  </p>
  <P onmouseover="this.style.cursor='auto'">正常鼠标auto</p>
  <P onmouseover="this.style.cursor='crosshair'">十字鼠标crosshair</p>
  <P onmouseover="this.style.cursor='default'">默认鼠标default</p>
  <P onmouseover="this.style.cursor='hand'">手hand</p>
  <P onmouseover="this.style.cursor='help'">求助鼠标help</p>
  <P onmouseover="this.style.cursor='move'">移动鼠标move</p>
  <P onmouseover="this.style.cursor='pointer'">手pointer</p>
  
  <!--
  <P onmouseover="this.style.cursor='e-resize,ne-resize,nw-resize,
			n-resize,se-resize,sw-resize,s-resize,w-resize'">改变大小鼠标</p>-->
  <P onmouseover="this.style.cursor='text'">文字鼠标text</p>
  <P onmouseover="this.style.cursor='wait'">等待鼠标wait</p>
  <p>======new======</p>
  <P onmouseover="this.style.cursor='all-scroll'">all-scroll </p>
  <P onmouseover="this.style.cursor='col-resize'">col-resize </p>
  <P onmouseover="this.style.cursor='no-drop'">no-drop </p>
  <P onmouseover="this.style.cursor='not-allowed'">not-allowed </p>
  <P onmouseover="this.style.cursor='progress'">progress </p>
  <P onmouseover="this.style.cursor='row-resize'">row-resize </p>
  <P onmouseover="this.style.cursor='vertical-text'">vertical-text </p>
  <P onmouseover="this.style.cursor='vertical-text'">url(uri) 用户自定义 cursor:url('#');#=光标文件地址(注意文件格式必须为.cur或.ani)。 </p>
 </BODY>
</HTML>


标签：

相关文章