[CSS] Hover (défilement bref) sur les noms catégories et forums

Vorn

Age : 27Messages : 2342

Lun 26 Mar 2012 - 18:40

Rappel du premier message :

#phpBB2

Bonjour ^^ Grâce à un petit bidouillage, et à la finition de notre codeur préféré Taktiik, je peux vous dévoiler cette astuce ^^ qui donnera:

Ici l'exemple

Si vous ne l'avez pas encore compris, il s'agit du titre de forum ( ou catégorie ) qui glisse quand la souris passe dessus.

Donc déjà, ce qu'il faut savoir, c'est que c'est le «:hover » qui va permettre cette astuce, accompagné d'une modification du .forumlink. On commence par prendre la partie

Code:

.forumlink
{
Vos personnalisations
}

.

On y ajoute les propriétés suivantes:

Code:

display: block;
  color: red; /* Couleur de départ */
text-align: left;
transition: all 1s; /* Durée de la transition, mettez les mêmes valeurs partout, ça sera plus facile */
-moz-transition: all 1s;
-webkit-transition: all 1s;

Maintenant, on passe au a.forumlink:hover, à rajouter dans la feuille CSS.

Code:

a.forumlink:hover
{
  color: green; /* Couleur d'arrivée */
  margin-left: 15px; /* Décalement ( nombre de px à décaler pour l'arrivée)*/
transition: all 1s;
-moz-transition: all 1s;
-webkit-transition: all 1s;
}


Voilà voilà :) Merci à Taktiik pour l'aide aussi ^^

Vos commentaires et remerciements sont toujours bienvenus ^^

Si vous avez des problèmes avec ce LS, venez poster ici.

Dernière édition par Winst le Mer 25 Avr 2012 - 19:44, édité 3 fois

Kakuu

Age : 28Messages : 30

Ven 20 Avr 2012 - 19:54

Merci :)

Arrogant Mischief

Age : 28Messages : 70

Ven 20 Avr 2012 - 21:37

Thanks !

Natsuhi

Age : 27Messages : 35

Sam 21 Avr 2012 - 3:50

Thank's =)

Shuu-Shuu

Age : 28Messages : 199

Sam 21 Avr 2012 - 10:15

merci beaucoup =D

Corkyie

Age : 26Messages : 75

Sam 21 Avr 2012 - 18:56

Merci !

sabritheducks_79

Age : 37Messages : 89

Sam 21 Avr 2012 - 22:03

je cherche cette astuce depuis des heures ^^

Nut'

Age : 24Messages : 37

Dim 22 Avr 2012 - 13:45

Merci bien (:

Vorn

Age : 27Messages : 2342

Dim 22 Avr 2012 - 22:36

De rien ^^

Zouzou

Age : 25Messages : 19

Ven 27 Avr 2012 - 22:07

Merci !

Vador

Age : 23Messages : 64

Ven 27 Avr 2012 - 22:45

merci

Sakira

Age : 31Messages : 89

Lun 7 Mai 2012 - 0:29

Merci beaucoup pour ce tuto^^

Kefka

Age : 29Messages : 15

Lun 7 Mai 2012 - 18:02

Merci beaucoup, hâte de voir comment tu as réussis ça é.è

Vorn

Age : 27Messages : 2342

Lun 7 Mai 2012 - 18:49

Merci :)

AlexeB

Age : 28Messages : 165

Mer 9 Mai 2012 - 0:25

Merci :)

Super Captain

Age : 32Messages : 33

Mer 9 Mai 2012 - 21:38

ça m’intéresse :3! merci du partage!

Little Ghost

Age : 34Messages : 91

Jeu 10 Mai 2012 - 11:03

Merci beaucoup =)

Moriarty

Age : 28Messages : 85

Jeu 10 Mai 2012 - 14:40

Merci ^^

Guigui

Age : 28Messages : 13

Jeu 10 Mai 2012 - 15:59

Classe OwO

Sunnie

Age : 26Messages : 13

Jeu 10 Mai 2012 - 19:37

Cet effet est magnifique, merci beaucoup pour le partage :)

Nalex

Age : 34Messages : 154

Ven 11 Mai 2012 - 14:03

Que la lumière soit! lol

Merci :)

warning.sign

Age : 33Messages : 58

Ven 11 Mai 2012 - 17:46

Merci bien =)

Tropik

Age : 30Messages : 58

Sam 12 Mai 2012 - 0:53

Merci !

Rin Nikky

Age : 25Messages : 37

Jeu 17 Mai 2012 - 10:31

Merci !

Cocow'

Age : 26Messages : 11

Sam 19 Mai 2012 - 17:24

Merci beaucoup !

Vorn

Age : 27Messages : 2342

Dim 20 Mai 2012 - 21:29

De rien ^^ Si vous avez un problème, n'hésitez pas

Contenu sponsorisé