par anonyme 28-Avril-2022

Comment faire pour changer le curseur de la souris en HTML ?

1 Réponse

par Antoine 28-Avril-2022

Vous pouvez changer le curseur de la souris HTML de deux manières distinctes :

  • En JavaScript avec l'objet DOM element.style.
  • En CSS avec la propriété cursor.

Vous pouvez utiliser les curseurs prédéfinis par les navigateurs internet, ou bien utiliser un curseur personnalisé sous la forme d'une image.

Exemple pour changer le curseur de la souris, au survol d'une image, en JavaScript :

<img src="https://www.1formatik.fr/os.jpg" id="image" alt="">
<script>
document.getElementById("image").style.cursor = "wait";
</script>

Exemple pour changer le curseur de la souris, sur toute la page, en CSS :

<style>
html, body {
  cursor: wait;
}
</style>

Exemple pour mettre une image en tant que curseur sur toutes les balises <div> :

<style>
div {
  cursor: url('image.png'), auto;
}
</style>
Bienvenue sur 1FORMATIK, où vous pouvez poser des questions en lien avec l'informatique et internet, et recevoir des réponses d'Antoine et d'autres internautes.

2.6k questions

3k réponses

...