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 »

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 13998 times
norman
Site Admin
Posts: 1252
Joined: Sat Feb 07, 2004 9:55 pm

Re: Background colour for "this section"

Post by norman »

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: 1252
Joined: Sat Feb 07, 2004 9:55 pm

Re: Background colour for "this section"

Post by norman »

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 13987 times
Norman
Artisan
Posts: 50
Joined: Fri Apr 25, 2008 3:28 pm

Re: Background colour for "this section"

Post by Artisan »

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

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

Re: Background colour for "this section"

Post by norman »

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