Vous n'êtes pas identifié.
Annonce
Mettez-vous à jour ! WordPress 3.3.2 est disponible en français.
Annonce 1 : Le Codex en français a besoin de vous pour avancer !
Annonce 2 : Avant de poster, n'oubliez pas de faire une petite recherche et de lire les règles de ce forum.
Annonce 3 : Lisez notre blog, il regorge de bonnes informations.
Annonce 4 : Rejoignez-nous sur Facebook, Google + et sur Twitter
#1 07-02-2012 17:04:09
Opacity en h1 et h2
Salut à tous,
Ma configuration WP actuelle
- Version de WordPress : 3.1.4
- Version de PHP/MySQL : 5.1.3RC
- Thème utilisé : Dot-B
- Extensions en place : Askinet et TinyMCE
- Nom de l'hebergeur : free.fr
- Adresse du site : http://hedonisteep.free.fr
Problème(s) rencontré(s) :
J'aimerais pouvoir faire en sorte que mes titres h1 et h2 dans mes pages et articles aient le même effet d'opacité progressive que le titre principale de mon site.
Pour mieux comprendre, je vous conseil d'aller sur mon site et de passer votre curseur sur le titre du site, puis sur le titre de la page principale par exemple.
Pour ceux qui connaissent, inspecté l'élément : j'observe que pour le titre principal l'opacité varie de 0 à 1, et j'aimerais la même chose pour les titres h1 et h2 de mes pages.
J'espère avec été assez précis, merci d'avance à tous!
Hedo
><((((°> Tour Du Monde à pied <º))))><
Hors ligne
#2 08-02-2012 12:30:13
Re: Opacity en h1 et h2
<a rel="home" title="" style="opacity: 1;">TDM en Routard</a>
C'est le code pour ton titre.
http://www.zonecss.fr/style_css/feuille … acity.html
C'est la propriété opacity en css (avec le code qui permet d'obtenir le même effet sur IE)
À inclure donc dans le style.css pour les balises h1 et h2 de tes pages
Wasicu c'est du lakota et signifie "Le blanc" - Merci à oOYOo pour la conception de cet avatar. - Ici je suis webmestre : Morisse et compagnie théâtre de marionnettes
Hors ligne
#3 08-02-2012 15:15:59
Re: Opacity en h1 et h2
Merci bien,
Le soucis c'est que le titre "TDM en Routard" est bien comme je le souhaiterais au niveau du dégradé progressif de l'opacité, mais j'aimerais pouvoir faire la même chose maintenant avec mes titres h1 et h2 sur toutes mes pages du site...
J'ai bien inclus le code que tu m'as donné dans mon css, mais ça ne change rien : lorsque je passe la souris sur un titre h1 ou h2, eh bien l'opacité s'effectue d'un seul coup sans progression de dégradée.
Voici mon css :
Code: html
h1, h2{color:#2089cc; line-height:1.1em; margin:0.3em 0; padding:0}
h3, h4, h5, h6{color:#333; line-height:1.1em; margin:0.3em 0; padding:0}
h1:hover{-khtml-opacity: 0.6; filter: alpha(opacity=60); -moz-opacity:0.6; opacity:0.6); text-decoration: none; color:#06c}
h2:hover{-khtml-opacity: 0.6; filter: alpha(opacity=60); -moz-opacity:0.6; opacity:0.6); text-decoration: none; color:#06c}
h1, h2, h3, h4, h5, h6{font-weight:normal}
h1{font-size:200%}
h2{font-size:183%}
h3{font-size:166%}
h4{font-size:150%}
h5{font-size:133%}
h6{font-size:116%}
Ya un truc qui cloche?
><((((°> Tour Du Monde à pied <º))))><
Hors ligne
#4 09-02-2012 09:52:14
Re: Opacity en h1 et h2
Bonne question. Je pense que normalement tu devrais mettre une opacity à 1 dans les h1 et h2 mais dans tous les tutos vus sur le web, le :hover est brutal.
Utilise alors la transition css3 : http://debray.jerome.free.fr/index.php? … transition
là tu as les préfixes propriétaires et là : http://www.greywyvern.com/?post=337
Comment traiter ton opacity.
Note que l'opacity est donnée au départ et à l'arrivée.
Wasicu c'est du lakota et signifie "Le blanc" - Merci à oOYOo pour la conception de cet avatar. - Ici je suis webmestre : Morisse et compagnie théâtre de marionnettes
Hors ligne