Bonjour,
J'ai fini par réussir à changer le background de ma navigation.
En utilisant ce code css :
html body #header-outer[data-transparent-header="true"].transparent{background-color: #a03c3c!important;box-shadow:none!important;-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;border-bottom:1px solid rgba(255,255,255,0.25)!important;}
Maintenant je souhaite passer à l'étape suivante qui est de rendre le changement de couleur dépendant du scroll.
J'ai donc créé un js file :
1 2 3 4 5 6 7 8 9 10 11 12 13
| jQuery(document).ready(function($){
$(function() {
$(window).on("scroll", function() {
if($(window).scrollTop() > 5) {
$(".header-outer").addClass("activeheader");
} else {
//remove the background property so it comes transparent again (defined in your css)
$(".header-outer").removeClass("activeheader");
}
});
})
}); |
et j'ai mis le code suivant dans mon script css :
1 2 3
| .header-outer.activeheader{
html body #header-outer[data-transparent-header="true"].transparent{background-color: #a03c3c!important;box-shadow:none!important;-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;border-bottom:1px solid rgba(255,255,255,0.25)!important;}
} |
Mais il ne se passe rien du tout. Ma barre reste transparente. Une idée de pourquoi ?
Partager