Sweet Purple
Admin
Messages : 131
Date d'inscription : 12/07/2010
Age : 29
 | Sujet: Avoir différents curseurs(3 manières) Bazzart  Dim 15 Mai - 19:03 | |
| - Fearless Winkle a écrit:
-
Les différents styles de curseurs:
- Normal; auto;
- En croix; crosshair;
- En attente; wait;
- En forme de main avec le doigt déplié. ; pointer;
- En aide; help;
- En progression; progress;
- En attente; wait;
* n-resize : Curseur de redimensionnement bas vers haut.
* s-resize : Curseur de redimensionnement haut vers bas.
* e-resize : Curseur de redimensionnement gauche vers droite.
* w-resize : Curseur de redimensionnement droite vers gauche.
* ne-resize : Curseur de redimensionnement bas-gauche vers haut-droite.
* nw-resize : Curseur de redimensionnement bas-droite vers haut-gauche.
* se-resize : Curseur de redimensionnement haut-gauche vers bas-droite.
* sw-resize : Curseur de redimensionnement haut-droite vers bas-gauche.
* not-allowed : Curseur en forme de rond barré.
* no-drop : Curseur en forme de main avec le doigt déplié et un rond barré.
* col-resize : Curseur fait de deux traits verticaux avec une flèche de chaque coté.
* row-resize : Curseur fait de deux traits horizontaux avec une flèche de chaque côté.
Cette fois, c'est le curseur normal qui vous gave ? Vous avez envie de changer un peu de différentes manières ? Comme toujours il suffit d'aller dans votre panneau d'administration - Affichage - Images&Couleurs - Couleurs - Feuille de style CSS puis de coller ces codes:
Pour avoir plusieurs curseurs différents (un qui est sur la page d'accueil( le "normal"), celui lorsque l'on passe la souris sur le lien puis le dernier quand on clique sur le lien). Ici ne n'est qu'un exemple donc vous pouvez changer la forme du curseur selon votre envie  :
- Code:
-
body{
cursor: crosshair;
}
a:link{
cursor: wait;
}
a:visited{
cursor: help;
}
Pour avoir un curseur personnalisé seulement quand on arrive sur un lien. Ici ne n'est qu'un exemple donc vous pouvez changer la forme du curseur selon votre envie :
- Code:
-
a:hover {cursor:sw-resize;}
Pour avoir un curseur toujours là, sur la page d'accueil mais pas lorsque l'on survole un lien. Ici ne n'est qu'un exemple donc vous pouvez changer la forme du curseur selon votre envie :
- Code:
-
body {cursor: crosshair;}
Voilà :woot: | |
|
