Blog iamvdo.meEffet de dégradé sur texte style Twitter
Utilisation des pseudo-éléments :before et :after
Création: janvier 2011Modifié:
Hover Me!
Utiisation des pseudo-éléments CSS3 ::after et ::before pour créer cet effet de dégradé. Aucune image utilisée, ni Javascript. Le contenu du menu est masqué par un dégradé qui est progressivement transparent. Le déplacement lors du hover permet de mieux apprécier l’effet.
#1par Yukulélé, le 14 avril 2011
vous pourriez aussi utiliser la propriété css
pointer-event:none ;
sur vos gradients (:before :after) ce qui permet de garder le :hover effectif sur toute la barre.
cette propriété très pratique est assez méconnue, elle est disponible sur la plupart des navigateurs.
#2par SolidSnake, le 12 mai 2011
Avec l’intégration du dégradé linéaire sous Opera, j’imagine que cet effet doit être possible aussi.
#3par both, le 19 avril 2012
bjr !! la demo de ce tuto est vraiment interessant.pourrai je avoir un tuto détaillé de celui-ci !! merci d’avance
#4par SouL Des, le 12 janvier 2013
Merci ♥