Navbar en mouse hover
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Navbar en mouse hover
Détails techniques
Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Capture d'écran du problème :
- Voir l'image:
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)
Description du problème
Bonjour,Je voudrais pouvoir mettre ce qu'on appelle, je crois, un "mouse hover" ; c'est-à-dire, un changement de couleur (du gris à la couleur) au moment où on clique sur les boutons de la barre de navigation.
Mon overall_header étant déjà modifié pour placer les éléments tels que membres, recherche, etc... tout en haut de la page.
PS: sur le forum je n'ai réalisé qu'un seul bouton à l'heure actuelle (le recherche). Et j'aimerais que, lorsque je vais créer les autres boutons, ceux-ci s'illuminent en passant le curseur de la souris dessus.
Merci d'avance
Re: Navbar en mouse hover
Bonjour, je poste pour voir le lien du forum et si je peux aider.
EDIT : Vous pouvez facilement réaliser l'effet en css en ajoutant ce code dans votre feuille de style :
le premier code :
#bar_nav_standard a = Les liens à l'intérieur de la #bar_nav_standart
filter: saturate(0) = filtre saturation à 0 (donc en noir et blanc)
deuxième code :
#bar_nav_standard a:hover = les liens survolés à l'intérieur de la #bar_nav_standart
filter: saturate(1) = filtre saturation à 1 (donc couleurs normales)
Donc les images seront en noir et blanc grace au premier code, et passeront en couleur seulement au survol du lien correspondant grâce au second code.
Il est également possible d'ajouter si vous souhaitez un effet de transition (apparition de la couleur plus graduelle, vitesse réglable, plutôt que d'un seul coup quand la souris est dessus)
EDIT : Vous pouvez facilement réaliser l'effet en css en ajoutant ce code dans votre feuille de style :
- Code:
#bar_nav_standard a {
filter: saturate(0);
}
#bar_nav_standard a:hover {
filter: saturate(1);
}
le premier code :
#bar_nav_standard a = Les liens à l'intérieur de la #bar_nav_standart
filter: saturate(0) = filtre saturation à 0 (donc en noir et blanc)
deuxième code :
#bar_nav_standard a:hover = les liens survolés à l'intérieur de la #bar_nav_standart
filter: saturate(1) = filtre saturation à 1 (donc couleurs normales)
Donc les images seront en noir et blanc grace au premier code, et passeront en couleur seulement au survol du lien correspondant grâce au second code.
Il est également possible d'ajouter si vous souhaitez un effet de transition (apparition de la couleur plus graduelle, vitesse réglable, plutôt que d'un seul coup quand la souris est dessus)
MlleAlys- Membre actif
- Messages : 5968
Inscrit(e) le : 12/09/2012
Re: Navbar en mouse hover
Bonsoir,
Merci pour votre réponse (c'est la deuxième fois !)
J'ai mis le code dans le fichier CSS mais, apparemment, aucun effet.
Merci pour votre réponse (c'est la deuxième fois !)
J'ai mis le code dans le fichier CSS mais, apparemment, aucun effet.
Re: Navbar en mouse hover
Alors lorsque j'inspecte votre forum, le code apparait bien, mais avec des caractères "parasites" qui faussent sa lecture :
Si les caractères apparaissent sur votre feuille de style, supprimez-les, sinon tentez de refaire le copier/coller, ou de refaire les espaces à la main.
Le code doit être ainsi :
Si les caractères apparaissent sur votre feuille de style, supprimez-les, sinon tentez de refaire le copier/coller, ou de refaire les espaces à la main.
Le code doit être ainsi :
MlleAlys- Membre actif
- Messages : 5968
Inscrit(e) le : 12/09/2012
Re: Navbar en mouse hover
Cela marche à la perfection !
Un énorme merci de plus ; je prie les vertus célestes que vos plaisirs soient sans mélange, votre beauté durable, et votre bonheur sans fin !
Un énorme merci de plus ; je prie les vertus célestes que vos plaisirs soient sans mélange, votre beauté durable, et votre bonheur sans fin !
Sujets similaires
» Création horloge Mickey Mouse
» Affichage navbar bouton
» Mettre la chatbox dans la navbar
» recodage d'un bouton de la navbar
» Changer groupes dans navbar
» Affichage navbar bouton
» Mettre la chatbox dans la navbar
» recodage d'un bouton de la navbar
» Changer groupes dans navbar
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum