Changer le curseur de la souris sur une page html

J'ai besoin d'un moyen de changer le curseur de la souris sur une page html. Je sais que cela peut être fait avec css, mais je dois être capable de le changer à l'exécution, comme par exemple avoir des boutons sur la page, et quand ils sont cliqués, ils changent le curseur pour un graphique personnalisé spécifique. Je pense que le meilleur (ou le seul?) Moyen de le faire est de javascript? J'espère qu'il y a une façon de le faire bien qui fonctionnera sur tous les principaux navigateurs. Je serais très reconnaissant si quelqu'un pouvait m'aider avec cela.Changer le curseur de la souris sur une page html

Merci à l'avance

Source

2009-07-31 Clox

Merci pour les réponses. J'ai finalement réussi à le faire fonctionner. Voici comment je l'ai fait:

<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>

Je trouve que pour le faire fonctionner dans Firefox vous doit passe au moins 2 choix de curseurs, par exemple cursor = "url ('cursor1.cur'), par défaut" Ou bien cela ne marchera pas. En outre, dans Firefox, il ne fonctionne pas avec les curseurs ani, seulement cur. C'est pourquoi j'ai mis un cur après ani. L'ani apparaîtra dans IE, le cur dans Firefox.

Est-ce que quelqu'un sait s'il est possible de changer le curseur dans IE sans que l'avertissement active-X n'apparaisse et que l'utilisateur doive accepter?

Source

2009-07-31 04:49:37 Clox

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

Theres un exemple en bas.

Source

2009-07-31 02:09:12

-1

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

Quel est le curseur spécial que vous voulez? ... il y a peut-être une meilleure option.

Source

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)";

Source

2009-07-31 02:20:42 Prestaul

C'est facile si vous voulez faire cela uniquement sur les liens. Il vous avez des CSS comme ceci:

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

Depuis: actif ne fonctionnera pas pour d'autres éléments qu'un, vous voudrez peut-être utiliser le Javascript indiqué par Prestaul et scunliffe.

Source

2009-07-31 02:30:31 Hurix

En utilisant JQuery:

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

Source

2011-05-29 06:38:56 Dave

Changer le curseur de la souris sur une page html

Répondre

Questions connexes