Cambiar el cursor del mouse en una página html

Necesito una forma de cambiar el cursor del mouse en una página html. Sé que esto se puede hacer con css, pero necesito poder cambiarlo en tiempo de ejecución, como por ejemplo tener botones en la página, y cuando se hace clic cambian el cursor a un gráfico personalizado específico. Creo que la mejor (¿o la única?) Forma de hacerlo es a través de javascript. Espero que haya una forma de hacerlo bien que funcione en todos los principales navegadores. Estaría muy agradecido si alguien pudiera ayudarme con esto.Cambiar el cursor del mouse en una página html

Gracias de antemano

Fuente

2009-07-31 Clox

Gracias por las respuestas. Finalmente lo tengo funcionando. Así es como lo hice:

<html> 
<head> 
    <script type="text/javascript"> 
     function changeToCursor1(){ 
      document.body.style.cursor="url('cursor1.ani'),url('cursor1.cur'), default"; 
     } 
     function changeToCursor2(){ 
      document.body.style.cursor="url('cursor2.ani'),url('cursor2.cur'), default"; 
     } 
    </script> 
</head> 

<body> 

    <form> 
     <input type="button" value="Change to cursor 1" onclick="changeToCursor1()" /><br> 
     <input type="button" value="Change to cursor 2" onclick="changeToCursor2()" /> 
    </form> 
</body>

descubrí que a conseguir que funcione en Firefox que necesidad pase al menos 2 opciones de cursores, por ejemplo, cursor = "url ('cursor1.cur'), por defecto" O de lo contrario no funcionará. Además, en Firefox no funciona con ani-cursores, solo cur. Es por eso que puse un cur después de ani. El ani se mostrará en IE, el cur de Firefox.

¿Alguien sabe si es posible cambiar el cursor en IE sin que aparezca la advertencia de X activa y el usuario tenga que aceptar?

Fuente

2009-07-31 04:49:37 Clox

http://www.javascriptkit.com/dhtmltutors/csscursors.shtml

Theres un ejemplo en la parte inferior.

Fuente

2009-07-31 02:09:12

-1

//you can set all the normal cursors like this 
someElem.style.cursor = 'progress';

¿Cuál es el cursor especial que desea? ... Tal vez hay una mejor opción.

Fuente

2009-07-31 02:16:42 scunliffe

-1

// Get the element you want to change the cursor for 
var el = document.getElementById('yourID'); 

// This image url is relative to the page url 
el.style.cursor="url(pathToImage.png)";

Fuente

2009-07-31 02:20:42 Prestaul

Es fácil si solo desea hacer esto en los enlaces. Ahí lo tienes un poco de CSS como esto:

a:hover { cursor: crosshair; } #this is when you mouseover the link 
a:active { cursor: wait; } #this is the moment you click it

desde: activo no funcionará para otros elementos además de una, es posible que desee utilizar el Javascript declarado por Prestaul y scunliffe.

Fuente

2009-07-31 02:30:31 Hurix

usando jQuery:

$('.myButton').click(function(){ 
    $(this).css('cursor', 'url(/url/to/cursor/image)'); 
});

Fuente

2011-05-29 06:38:56 Dave

Cambiar el cursor del mouse en una página html

Respuesta

Cuestiones relacionadas