Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Trying to adjust menu colors and other factors

Hello,

This is the site I'm working on:

I'm trying to have it so when you click on a section on the left hand menu that section you choose turns a different color.

Example:

Click on "Intended Use" on the left menu

I then want "Intended Use" to change color to a bright green

I've been told this can be done with JavaScript but I don't know JS very well.

Thanks for your time and help!

1 Answer

Steven Parker
Steven Parker
243,318 Points

You can do this with JavaScript, but it's something easily done (potentially) with CSS:

a:visited { color: green }

One JavaScript/JQuery method (which adjusts the CSS anyway) would be:

$("a").click(function () {
    $(this).css("color", "green");
});

The trick is where to do it - you have a large collection of pretty complicated CSS modules already, and several JavaScript modules, and have them loading in an unconventional sequence. This makes it tricky to know where to place changes like this so they will not be overridden, unless you have really good familiarity with the workings of each of those modules.

On the other hand, some of these other modules might help with doing things like this, if you do it according to their API (often by setting special classes). But again, you have to know the modules.

Thanks Steven!

So the problem is I took this site over after the previous designer was "let go" so I feel like I'm cleaning up a bit and/or re-structuring.

I tried the CSS route but that didn't work. I put the JS in but it doesn't seem to work either. I put JS in the theme backend area for JS but maybe I should put the code in the actual files themselves?

Thanks again for your time!