Médiaforma

Modifier le pointeur de la souris

Print Friendly

Cette rubrique va vous montrer comment modifier le pointeur de la souris dans un document. L’utilisateur choisit un pointeur en sélectionnant un bouton radio. Le pointeur change immédiatement de forme jusqu’à ce qu’il sélectionne un autre bouton radio.

Voici le code utilisé :

Le code HTML définit dix-huit boutons radio. Chacun d’entre eux a pour nom pointeur, mais les valeurs qui sont affectées à leur attribut value sont différentes. Lorsque l’utilisateur choisit un bouton radio en cliquant dessus, la fonction JavaScript change() est exécutée, en lui transmettant l’élément this.form.pointeur, c’est-à-dire l’ensemble des boutons radio.

Examinons le code JavaScript.

Lorsqu’un bouton radio est choisi, la fonction change() s’exécute. Les boutons radio this.form.pointeur qui lui sont transmis seront manipulés sous le nom radio dans la fonction.

Une boucle for passe en revue chacun des boutons radio. Le parcours se fait du premier bouton radio au dernier en utilisant les valeurs 0 et radio.length :

for (var i=0; i<radio.length;i++)

Si un des boutons radio est sélectionné :

if (radio[i].checked)

Sa valeur est stockée dans la variable p :

var p = radio[i].value;

Une fois la boucle terminée, la forme du pointeur est mise à jour en lui appliquant la valeur stockée dans la variable p :

document.body.style.cursor = p;

Vous avez aimé cet article ? Partagez-le avec vos réseaux...
 
Comments

No comments yet.

Leave a Reply