1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Change the color of the clicked submenu

Discussion in 'Free Divi Community Forum' started by John Waluthon, Apr 30, 2021.

  1. John Waluthon

    John Waluthon New Member

    Hello everyone. Hopefully this isn't a stupid question to begin with but this problem has given me a great headache. It's regarding the submenu on DIVI. I have created clickable dropdown submenus and the functionality works as expected. Now the problem is that when I click a submenu, the font color of the opened submenu SHOULD BE BLUE (in the photo, the text UNTERNEHMEN should be blue). Until now, the color is set to the color I configured beforehand on my CSS customizer, which is gray.

    When the user closes the submenu, the color should turn back into default color (grey).

    Below is the attempt I've written on jquery:
    Code:
    Log In or Sign Up to view this code.
    I'm very aware that it's useless to put CSS function on $('.sub-menu') as I wrote above, since it won't change anything. Until now, with this code I only receive an output as such: all the submenu font color will be turned to blue as I click one of the submenus. As I click the window, the color of all submenu texts will turn to default color, which is gray.

    I'd really appreciate all the feedback this community could give. If this thread is kinda confusing to be understood, kindly ask me. Thank you!
     

    Attached Files:

    #1 John Waluthon, Apr 30, 2021
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Freelancer' Divi layout for all Pro members:View Demo
  2. John Waluthon

    John Waluthon New Member

    !UPDATE!

    I somehow manage to change the font color of the parent menu item (in the previous picture the menu UNTERNEHMEN) to desired color (blue). Below is the updated jquery codes:
    Code:
    Log In or Sign Up to view this code.
    I also attached a picture to show the result of those codes above. The problem now is that when I click the opened submenu once again in order to close it, the color stays blue as it should be grey. I would really love to see all of your feedback!
     

    Attached Files:

    #2 John Waluthon, Apr 30, 2021
  3. Divi.Help

    Divi.Help Administrator
    Staff Member

    I guess it would be easier for you to add CSS Class to the active menu item, similar to the submenu. And use custom CSS to style it, instead of using jQuery.
     
    #3 Divi.Help, May 5, 2021
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Industrial' Divi layout for all Pro members:View Demo
  4. John Waluthon

    John Waluthon New Member

    I actually added the CSS class to the active menu item, but somehow it just did not work as I expected. But here's a new UPDATE!

    After a long struggle and failed attempts, I finally managed to solve it using a bit of jquery codes. Below is my updated jquery codes:
    Code:
    Log In or Sign Up to view this code.
    The CSS codes are very simple:
    Code:
    Log In or Sign Up to view this code.
    Well, to be really honest, I'm not sure if this would be an elegant solution, but this is what I came up with
     
    #4 John Waluthon, May 6, 2021
(You must log in or sign up to post here.)