By markpetherbridge on

Hey Guys and Girls.

I've installed and currently using nice menus and it's great, there is however one thing that I need help with:

It adds an active class to the current page that you are viewing, that's good but if its a page that is in the subnav I need it to add an active class the the parent too so that the top level also has the class..

Anyone got any ideas?

Comments

markpetherbridge’s picture

markpetherbridge commented

For all those who find this and need a solution, this is what I came up with. Using jQuery: 

// adds the .active class up all levels
// use when page loads
$('.active').parents('.menuparent').children('a').addClass('active');
herkimer’s picture

herkimer commented

Works like a charm. Thanks!

AnamBeatha’s picture

AnamBeatha commented

Hi, this looks like the perfect solution to my issue with nice menus. I'm pretty new to both Drupal and theming, so still learning my way around. Can you tell me which file I place this code into in my custom theme? Thanks so much for your time!

mindhunter75’s picture

mindhunter75 commented

Subscribing ... Where can i put this piece of code?

Lakesideflight’s picture

Lakesideflight commented

What file did you put this code in?

lk7889’s picture

lk7889 commented

You'll want to add that to your head tag in the code of your theme but you will also need the code to let Drupal know it's jQuery and to load it at page load.

Here's what I added to my head tag:

<script type="text/javascript">
	jQuery(document).ready(function($) {
  	$('.active').parents('.menuparent').children('a').addClass('active');
});
</script>

The head code in my template was in html.tpl.php but it might be different for your theme (and I'm working in Drupal 7).

It's probably not the best way but I'm a jQuery newbie and I was just glad it worked.

58splitty’s picture

58splitty commented

Thanks Mark,

just what I was after and it worked a treat. Good work

leearia’s picture

leearia commented

In my menu I have a page that's a child twice. e.g

  • Caterpillar
    • Larva
  • Spider
  • Worm
    • Beetle
    • Larva

Because of Larva, this jQuery fix makes both Caterpillar and Worm active. Is there a way to remedy this. Or a more efficient way to do this? (I'm in Drupal 6)