Indexhibit^TM
Index + Exhibit

Hi,

I am trying to style one of the four sections on our website menu, so that the listed links in this section are in a different colour to the three others (the menu in question would be the NEWS section).

Thanks in advance for any advice.

Not the best way, but it's fast...for now...put this into a js file...

1. function style_list(group, name)
2. {
3.     // group is the section - start from 0 when counting
4.     // name is the class name you will attach to the ul
5.     $("#menu ul:eq(" + group + ")").addClass(name);
6. }

Then add this to the onready rules...

1. $(document).ready(function(){ style_list(3, 'red') });

This adds the class of 'red' to your news list...the ul tag. So, you can style from there however you want...such as...

1. #menu ul.red { color: red; }
2. #menu ul.red li a { color: red; }

I wrote this in such a way that it could be used by others in the future...

;)

I tested this...works without a hitch...

Great work - thanks Vaska!

Hmmm let me see if I have understood this correctly

I've made a .js file with your code and saved it to the site/js folder with the name "style_list.js"

Then I added..

1. <script type='text/javascript' src='<%baseurl%><%basename%>/site/js/style_list.js'></script>

1. ...To the site/sample/index.php file and further down the same document I added the onready functions like this....
2. $(document).ready(function()
3. {
4.     setTimeout('move_up()', 1);
5.     style_list(3, 'red')
6. });

lastly I added the style to my site/sample/style.css like this...

1. #menu ul {
2.     line-height:1.5;
3.     text-align:right;
4.     font-style:normal;
5.     font-family:Georgia,"Times New Roman",Times,serif;
6.     list-style: none;
7.     margin: 0 0 12px 0;
8. }

#menu ul.red { color: red; }

#menu ul li.section-title {
font-style:italic;
text-align:right;
font-size: 14px;
font-family: Helvetica,Arial,sans-serif;
font-weight:bold;
margin:1px 0;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;

}

but alas nothing....?

have i misunderstood the whole concept?

hmmm wierd formatting on that post....

sorry I was getting it right... just some cache issues in my browser..

thanks all

nice work around!
is it possible to write the id of each section to the ul?
(eg. the class of the body-tag)

1. i got something weird going on. I styled my section 2 to be redstyle_list(2, 'about'); but it's actually affecting my section 10 links... 
2. How is that possible? 
3. Thanks

sorry for the weird formatting on that post...

in addition to my last post, i realized that the order of section i see in my source code does not correspond with the order I give it in the CMS. For instance, my About page is section 2, but when I look at the published page it says body class section-6. how does this work? sorry if this a stupid question, I'm still learning :)

Hi, how can i change the css style of the title of each section ?

i don't want to change the entire block of each section, only the title.

It's can be posible ?

in the other hand, where i can modify the html ?

Thanks For All, this is a great system !

#menu ul li.section-title

#menu ul li.section-title:
this is not for the all title sections in the web ?

I want to change each title independently the others titles.
Example, i want the first of my 3 titles, in color blue, the second in red and the third yellow, how can i change the css style for each of this title ?

For what it's worth, I've posted an outline of how to solve this without resorting to Javascript:

http://indexhibit.org/forum/thread/7869/