Background colour for "this section"

Expanding / Collapsing, search engine friendly, Section menu.
Post Reply
Artisan
Posts: 50
Joined: Fri Apr 25, 2008 3:28 pm

Background colour for "this section"

Post by Artisan » Mon Mar 09, 2009 12:16 pm

I've got no problem with changing the background and/or text colour in hsa_c and nsa_c in collapso-5-RolloverBoxes.css, but I need to do a bit more than that, I'd like to change the colour of the whole background for the menu item corresponding to the the page being displayed.

In the attachment, the image on the left is as far as I can get, and the image on the right is what I'm trying to do.

I know this is possible because I've seen it on a site... if only I could find it again :?

Malcolm
Attachments
Collapso-colours.jpg
Collapso-colours.jpg (54.16 KiB) Viewed 8132 times

norman
Site Admin
Posts: 1239
Joined: Sat Feb 07, 2004 9:55 pm

Re: Background colour for "this section"

Post by norman » Mon Mar 09, 2009 12:25 pm

I'm afraid that I've not found a way to do this.

The text is the link for the Section and the Collapso code can detect this.

The LI around the link is the bit you want to colour and the Collapso code cannot alter this.
Norman

norman
Site Admin
Posts: 1239
Joined: Sat Feb 07, 2004 9:55 pm

Re: Background colour for "this section"

Post by norman » Mon Mar 09, 2009 1:24 pm

I've had another look and the best I can do is to allow style from the start of the Section name to the right hand side. See photo.

To do this do the following:

Edit layout Collapso-5 Menu (back it up first).

Look for the line (about line 57):

$currentid = 'ul_' . $thislevel . '_' . $index;

From there, look for the next <div> and replace it with <div class=\"hsl$classadjust\">

From there, replace all remaining (there should be 3 more) <div> with <div class=\"nsl$classadjust\">

OK out.

Add the following to your Collapso CSS file:

Code: Select all

 .nsl	{}					/* DIV around link - No Sub Section */
 .hsl	{}					/* DIV around link - Has Sub Section */
 .nsl_c	{background-color:pink; border:1px solid red; margin-right:3px;}	/* DIV around link - No Sub Section - Current Page */
 .hsl_c	{background-color:pink; border:1px solid red; margin-right:3px;}	/* DIV around link - Has Sub Section - Current Page */
This tweak is not part of Collapso and is not supported.
Attachments
collapso-divs.jpg
collapso-divs.jpg (7 KiB) Viewed 8121 times
Norman

Artisan
Posts: 50
Joined: Fri Apr 25, 2008 3:28 pm

Re: Background colour for "this section"

Post by Artisan » Mon Mar 09, 2009 4:51 pm

Many thanks, Norman, that works nicely (temporary demo at http://06.artinet.co.uk/) :D

Malcolm

norman
Site Admin
Posts: 1239
Joined: Sat Feb 07, 2004 9:55 pm

Re: Background colour for "this section"

Post by norman » Mon Mar 09, 2009 5:08 pm

It's just what you wanted - I thought you'd get as per my screenshot.

I was using the style from collapso-5-Standard.css when testing and it didn't do as good a job as you got with collapso-5-RolloverBoxes.css.
Norman

Post Reply