Menu > Colors

nibz

I know.
But you have to take it in as considoration, to support or not support IE8 and <.

I guess you can check for yourselfe (google analytics). Then you know if your target group needs backward compatibility.

Tez Oner

Hey,

indeed a pity for IE8 users ;) in this case check what the target group
of the website is... IE8 was released in yes... 2009 some few months and
it's 5 years old and it's about 10% of total browser usage.

http://www.sitepoint.com/browser-trends-may-2013/

Cheerz,

Tez Oner
Tez | VA-MDS / MMO | communications
--------------------------------------------
info@va-mds.com / [url="http://va-mds.com"]http://va-mds.com[/url]

nibz

One downside to using :nth-child in css:
Quote from: http://www.w3schools.com/cssref/sel_nth-child.asp
The :nth-child() selector is supported in all major browsers, except IE8 and earlier.

Tez Oner

Hey,

could also be done with CSS using the :nth (child) selector,
eg; ul > li > li:nth-child(2) means that to the 2nd li of any li
can be selected for CSS-styling.

http://illegalistic.nl/pages/posts/applying-a-css-class-to-a-child-object-4.php

Cheerz,

Tez Oner
Tez | VA-MDS / MMO | communications
--------------------------------------------
info@va-mds.com / [url="http://va-mds.com"]http://va-mds.com[/url]

bupaje

Ah, perfect - thanks very much. :)

jacobi22

you can use [sib] as a counter for the menu-childrens and combined this [sib] with a css-class -> class="[class] color[sib]

as example

<?php

show_menu2
(1SM2_ROOTSM2_START,  SM2_ALL|SM2_TRIM|SM2_PRETTY,'<li><a href="[url]" class="[class] color[sib]"><span>[menu_title]</span></a>''</li>''<ul>''</ul>'falsefalse);

?>


result is a source-code like this for the menu

<!-- show_menu2 -->
<ul class="menu">
    <li><a href="/wb_jacobi22/" class="menu-expand menu-current menu-first color1"><span>Home</span></a>    </li>
    <li><a href="/wb_jacobi22/webdesign" class="menu-expand menu-sibling color2"><span>Webdesign</span></a>    </li>
    <li><a href="/wb_jacobi22/referenzen" class="menu-expand menu-sibling color3"><span>Referenzen</span></a>    </li>
    <li><a href="/wb_jacobi22/privates" class="menu-expand menu-sibling menu-last color4"><span>Privates</span></a>    </li>
</ul>


use css-class color1 - color4 for your background-colors

bupaje

I was wondering if there was a way to have a menu with each new 'tab' having a background color assigned automatically, perhaps from a list of predesignated colors?



So I might create a group of descending shades of blue for example and each new top level page added would use the next color from the list? 

As an alternative I guess I could find a way to set a unique ID for each top level menu item and then over ride the background color for each of those but thought I'd ask.