Aller au contenu
Création de sites web en éco-conception

22/01/2015 Modifier le curseur de la souris

Il est possible et même très simple de modifier l'apparence du curseur en fonction de la zone sur laquelle il se trouve.

Ce peut être utile pour donner l'apparence d'un lien hypertexte à un élément qui n'a pas d'attribut "href" (qu'il s'agisse ou non d'une balise "a").

.pseudo_href {cursor:pointer}

Grâce à la déclaration ci-dessus, si la curseur survole un élément avec la classe pseudo_href, il aura l'apparence d'un pointeur (une main avec l'index pointé vers le haut).

D'après w3schools, les navigateurs supportent les types de curseurs suivants (survolez-les avec votre souris pour les visualiser) :

  • default curseur par défaut
  • text : zone texte
  • pointer : lien
  • auto curseur par défaut du navigateur
  • inherit récupère la valeur de l'élément parent
  • crosshair : pointeur de précision
  • help : à l'aide !
  • move : déplacement
  • progress et wait pour l'attente

Curseurs de redimensionnement :

  • n-resize
  • ne-resize
  • e-resize
  • se-resize
  • s-resize
  • sw-resize
  • w-resize
  • nw-resize

Il est également possible de définir ses propres images de curseurs : Utilisation d'URL pour la propriété cursor.

Commentaires

Ajouter un commentaire :