A la luz del paso del tiempo, como las personas han mencionado, ahora puede usar de forma segura:

 li { cursor: pointer; } 

Usar para li

 li:hover{ cursor: pointer; } 

Vea más propiedad del cursor con el ejemplo después de ejecutar la opción de fragmento.

 .auto { cursor: auto; } .deafult { cursor: default; } .none { cursor: none; } .context-menu { cursor: context-menu; } .help { cursor: help; } .pointer { cursor: pointer; } .progress { cursor: progress; } .wait { cursor: wait; } .cell { cursor: cell; } .crosshair { cursor: crosshair; } .text { cursor: text; } .vertical-text { cursor: vertical-text; } .alias { cursor: alias; } .copy { cursor: copy; } .move { cursor: move; } .no-drop { cursor: no-drop; } .not-allowed { cursor: not-allowed; } .all-scroll { cursor: all-scroll; } .col-resize { cursor: col-resize; } .row-resize { cursor: row-resize; } .n-resize { cursor: n-resize; } .e-resize { cursor: e-resize; } .s-resize { cursor: s-resize; } .w-resize { cursor: w-resize; } .ns-resize { cursor: ns-resize; } .ew-resize { cursor: ew-resize; } .ne-resize { cursor: ne-resize; } .nw-resize { cursor: nw-resize; } .se-resize { cursor: se-resize; } .sw-resize { cursor: sw-resize; } .nesw-resize { cursor: nesw-resize; } .nwse-resize { cursor: nwse-resize; } .cursors > div { float: left; box-sizing: border-box; background:#f2f2f2; border:1px solid #ccc; width: 20%; padding: 10px 2px; text-align: center; white-space: nowrap; &:nth-child(even) { background: #eee; } &:hover { opacity: 0.25 } } 

 
Example of cursor
 
 
auto
 
default
 
none
 
context-menu
 
help
 
pointer
 
progress
 
wait
 
cell
 
crosshair
 
text
 
vertical-text
 
alias
 
copy
 
move
 
no-drop
 
not-allowed
 
all-scroll
 
col-resize
 
row-resize
 
n-resize
 
s-resize
 
e-resize
 
w-resize
 
ns-resize
 
ew-resize
 
ne-resize
 
nw-resize
 
se-resize
 
sw-resize
 
nesw-resize
 
nwse-resize
  

No necesita jQuery para esto, simplemente use el siguiente CSS:

 li {cursor: pointer} 

¡Y voilá! Práctico.

 li:hover { cursor: pointer; } 

Otros valores válidos (qué hand no es) para la especificación de HTML actual se pueden ver aquí .

utilizar

 cursor: pointer; cursor: hand; 

si quieres tener un resultado de navegador cruzado

CSS:

 .auto { cursor: auto; } .default { cursor: default; } .none { cursor: none; } .context-menu { cursor: context-menu; } .help { cursor: help; } .pointer { cursor: pointer; } .progress { cursor: progress; } .wait { cursor: wait; } .cell { cursor: cell; } .crosshair { cursor: crosshair; } .text { cursor: text; } .vertical-text { cursor: vertical-text; } .alias { cursor: alias; } .copy { cursor: copy; } .move { cursor: move; } .no-drop { cursor: no-drop; } .not-allowed { cursor: not-allowed; } .all-scroll { cursor: all-scroll; } .col-resize { cursor: col-resize; } .row-resize { cursor: row-resize; } .n-resize { cursor: n-resize; } .e-resize { cursor: e-resize; } .s-resize { cursor: s-resize; } .w-resize { cursor: w-resize; } .ns-resize { cursor: ns-resize; } .ew-resize { cursor: ew-resize; } .ne-resize { cursor: ne-resize; } .nw-resize { cursor: nw-resize; } .se-resize { cursor: se-resize; } .sw-resize { cursor: sw-resize; } .nesw-resize { cursor: nesw-resize; } .nwse-resize { cursor: nwse-resize; } 

También puede hacer que el cursor sea una imagen:

 .img-cur { cursor: url(images/cursor.png), auto; } 

Este hilo se está yendo de las manos, pasó rápidamente de los cursores a los instrumentos de cuerda. 🙂

Afortunadamente, Google siempre me envía aquí cuando necesito un recordatorio rápido, para un navegador cruzado completo, use:

 cursor: pointer; cursor: hand; 

 li:hover {cursor: hand; cursor: pointer;} 

Creo que sería inteligente mostrar solo el cursor de mano / puntero cuando JavaScript esté disponible. Entonces las personas no tendrán la sensación de que pueden hacer clic en algo que no se puede hacer clic.

Para lograr eso, puedes usar javascript para agregar el CSS al elemento como tal

 $("li").css({"cursor":"pointer"}); 

o encadenarlo directamente al controlador de clics.

O cuando se utiliza el modernizador en combinación con , el CSS se vería así

 .js li { cursor: pointer; } 

Solo para completar:

 cursor: -webkit-grab; 

también da una mano, la que conoces al mover la vista de una imagen.

Muy útil si quieres emular el comportamiento de agarre usando jquery y mousedown.

 ul li:hover{ cursor: pointer; } 

Para poder hacer que cualquier cosa obtenga el tratamiento “mousechange”, puede agregar una clase CSS:

 .mousechange:hover { cursor: pointer; } 

 Some text here 

Simplemente haz algo como esto:

 li { cursor: pointer; } 

Lo aplico en tu código para ver cómo funciona:

 li { cursor: pointer; } 

 
 
foo
 
goo
  

 ul li:hover{ cursor: pointer; } 

para obtener más eventos del mouse, verifique la propiedad CSS del cursor

Todas las otras respuestas sugieren usar el puntero estándar de CSS, sin embargo, hay dos métodos:

1. Aplicar el cursor:pointer; propiedad CSS cursor:pointer; a los elementos. (Este es el estilo predeterminado cuando un cursor se desplaza sobre un botón).

2. Aplicar el cursor:url(pointer.png); propiedad CSS cursor:url(pointer.png); usando un gráfico personalizado para su puntero. Esto puede ser más conveniente si desea asegurarse de que la experiencia del usuario sea idéntica en todas las plataformas (en lugar de permitir que el navegador / sistema operativo decida cuál debería ser el cursor del puntero). Tenga en cuenta que las opciones de repliegue se pueden agregar en caso de que no se encuentre la imagen, incluidas las URL secundarias o cualquiera de las otras opciones, es decir cursor:url(pointer.png,fallback.png,pointer);

Por supuesto, estos pueden aplicarse a los elementos de la lista de esta manera li{cursor:pointer;} , como una clase .class{cursor:pointer;} , o como un valor para el atributo de estilo de cada elemento style="cursor:pointer;" .

para símbolo de mano básico: prueba

 cursor:pointer 

Si desea un símbolo de mano como arrastrar algún elemento y soltarlo,

tratar

 cursor:grab 

Puede usar uno de los siguientes:

 li:hover { cursor: pointer; } 

o

 li { cursor: pointer; } 

Ejemplo de trabajo 1:

  li:hover { cursor: pointer; } 

 
 
foo
 
bar
  

También puedes usar el siguiente estilo

 li { cursor: grabbing; } 

Puedes usar el siguiente código

li: hover {cursor: puntero; }

Usando un Hack HTML

Nota: esto no es recomendable, ya que se considera una mala práctica

Envolver el contenido en una etiqueta delimitadora que contenga un atributo href funcionará sin aplicar explícitamente el cursor: pointer; propiedad con el efecto secundario de las propiedades de anclaje (modificado con CSS):

 
This is bad practice, but it works. 

Esto debería funcionar