Des effets à transitions au passage de la souris

[lly*]

Bonjour!

J'aimerais savoir comment on obtient un effet comme ceux des catégories de ce forum: http://horse-trash.chocoforum.com/
En gros, quand on passe la souris sur le nom des parties du forum, la couleur change progressivement. J'aimerais savoir comment faire.

Merci à ceux qui voudront m'aider:

[Freyja des Terres de Wyrd]

Bonsoir =)

Cela est réalisable avec le CSS cependant vous n'avez pas précisé quels éléments seraient concernés par cette transition ?

Voilà en tous cas le code pour que la couleur des titres de catégories change progressivement en rouge =)

Code:

.forumlink {
  -webkit-transition: color 1.5s ease-in;
    -moz-transition: color 1.5s ease-in;
    -o-transition: color 1.5s ease-in;
    transition: color 1.5s ease-in;
}

a.forumlink:hover {
  color: #FF0000;
}

Pour changer la couleur, il faut remplacer le "#FF0000"
Pour changer la vitesse de transition, il faut modifier le "1.5s"

Voilààà =)
J'espère vous avoir aidée =)

[lly*]

Bonjour!

Oh oui je m'excuse de ne pas avoir préciser mais merci c'est ce que je voulais!
Sinon, vous savez comment faire pour qu'il y ai une transition dans le déplacement du texte? Par exemple qu'il se déplace lentement de la gauche vers la droite. Il suffit de changer quoi?

[Manumanu]

Bonjour,

Il te suffit de modifier le code comme suit :

Code:

.forumlink {
  -webkit-transition: all 1.5s ease-in;
    -moz-transition: all 1.5s ease-in;
    -o-transition: all 1.5s ease-in;
    transition: all 1.5s ease-in;
}

a.forumlink:hover {
  color: #FF0000;
  margin-left: 20px;
}

MAIS je te le déconseille fortement. C'est certes "joli" (et encore, tout est relatif), mais c'est pénible à l'utilisation (imagine tes boutons de windows qui gigoteraient chaque fois que tu veux les cliquer), et tous les navigateurs ne prennent pas encore en charge la transition progressive ; pour ceux-ci, cela devient parfois très dur d'accéder à une catégorie, parce qu'elle fiche le camp de sous le curseur lorsqu'il survole le lien, mais le texte étant trop petit, celui-ci sort de la zone du curseur, reviens donc en position initiale où il se retrouve survolé, et se met donc à clignoter sans pouvoir être cliquable.

D'une manière générale, pour des questions d'accessibilités (pense aussi que tu peux avoir des membres ayant des difficultés motrices et/ou visuelles), il est déconseillé de modifier la taille ou la position d'un élément lors de son survol (donc passer un lien en gras au survol, ou bien en italique, ou même en majuscules) ; le changement de couleur est ce qu'il y a de plus approprié.

Voilà voilà. À toi de voir.

[lly*]

Bonjour!

Et bien merci pour le code mais aussi pour la remarque! Je verrai bien ce qui va et ne va pas mais je prendrai ceci en compte.
Encore merci!