Change menu item color on scroll
-
Hello everyone,
I'm trying to realize a navigation bar that changes color on scroll, I have successed in adding the Jquery to change the color of the navigation bar, thanks to this forum.
However, I find no solution to change the color of the menu item, as the class of the navigation bar applied by wordpress does not want to be overrided. Does anyone know a possible solution?I include the code I've tried to use already. I also tried to use the same function for the menu item as the one for the nav bar but it did not work at all.
By inspecting the website I can see that the class is being added to whatever element I add it to, however it does not override the other class.Any help would appreciated, thank you.
<script> jQuery(document).ready(function(){ jQuery(window).scroll(function() { // check if scroll event happened if (jQuery(document).scrollTop() > 600) { // check if user scrolled more than 50 from top of the browser window jQuery(".navbar").css("background-color", "#ffffff"); // if yes, then change the color of class "navbar" to white (#ffffff) } else { jQuery(".navbar").css("background-color", "transparent"); // if not, change it back to transparent } }); }); jQuery(document).ready(function() { jQuery(window).scroll(function() { if (jQuery(document).scrollTop() > 600) { jQuery("nav").addClass("menuitemblack"); } else { jQuery("nav").removeClass("menuitemblack"); } }); }); </script> .menuitemblack { color: red !important; z-index: 30; } -
-
A anamsp referenced this topic on
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login