Grow your CSS skills. Land your dream job.

nav background color after click

  • # September 15, 2012 at 9:49 pm

    I created a hover effect for my nav links. I want the hover background color to stay after the user has clicked a particular nav link, so it will show them the site area they are in. This site does that, as do a number of others. How is it done?

    Thanks for any help!

    -Margaret

    # September 15, 2012 at 10:14 pm

    A couple ways to do this…

    A. Add a class to the current page item, e.g. “active”…You just simply move it to the respective page item on each separate html page

    B. Use Jquery to add/remove the “active” class as needed when the items are clicked.

    # September 15, 2012 at 11:47 pm

    Also, if you’re using WordPress you can just target the body class/ID to set the active class.

    Example:
    `body.page-id-1 .active {color: red;}`

    # November 24, 2012 at 3:21 pm

    Thank you both :-)

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".