Tigra Menu Product Family - Setting item colors independently within single block


	\| About Us \| Services \| Download \| Order \| Support \| \|

Not logged in [ Login | Register ]

SoftComplex Forums » Tigra Menu Product Family » Setting item colors independently within single block

Last active: Never

Printable Version | Subscribe | Add to Favourites

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 8/13/2002 at 08:10 AM

Setting item colors independently within single block

To set colors independently for each menu item (both free and PRO versions) put simple wrapper function into the menu_item.js

function wrap(text, bg_color, fg_color) {
return('<table cellpadding="0" cellspacing="3" border="0" bgcolor="'
+ bg_color + '" width="100%"><tr><td style="padding: 3px; '
+ 'font-family: tahoma, verdana, arial; font-size: 13px; color:'
+ fg_color + '">' + text + '</td></tr></table>');
}

... and call the wrapper for each cation with parameters (demo structure below is for PRO version):

var MENU_ITEMS =[
[wrap('Home', '#cccccc', 'red'),"/index1.html",null, null],
[wrap('Company', 'green', 'yellow'), null, null],
[wrap('Products', 'blue', 'white'), null, null],
];

tigra has attached this image:
wrap_color.gif - 969b

dhiru

Junior Member

Posts: 2
Registered: 9/9/2002
Member Is Offline

posted on 9/13/2002 at 06:11 AM

Borders

Hi

I used the wrapper function to set the item colors independently, but the problem is i am not able to remove the white border which is shown.

Could u please tell me if there is a solution for this.

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 9/13/2002 at 07:39 AM

Make sure there is no borders in CSS files defined for menu items.

sundevil

Newbie

Posts: 1
Registered: 10/21/2002
Member Is Offline

posted on 11/5/2002 at 12:54 PM

Tried it, but the link to the page / file now seems to be in the border of the cell. Not in the content.

Have I forgotten something or is this something I have to live with?

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 11/11/2002 at 10:17 AM

Remove/unlink css file. When using inner HTML feature make sure settings don't interfere with CSS formatting.

rkopnisk

Newbie

Posts: 1
Registered: 9/8/2004
Member Is Offline

posted on 9/8/2004 at 06:16 PM

Mouse-Overs & Click Colors

Nice.

Any way to get the mouse-over color changes and the on-click color changes working with a different set of colors for a single item?

I'm trying to get the leaves (items with no child items) to have a different color scheme from non-leaf menu items (items with child items). The mouse-over and on-click colors are a big part of the look and feel of the site.

Thanks.

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 9/10/2004 at 10:28 PM

You can assign HTML for different states of the item with Tigra Menu PRO and Tigra Menu GOLD. Free version doesn't support this feature.

BlahBlah

Newbie

Posts: 1
Registered: 9/23/2004
Member Is Offline

posted on 9/23/2004 at 02:59 PM

How would one do this in Gold or Pro?

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 12/9/2004 at 04:40 PM

With Tigra Menu GOLD and Tigra Menu PRO you can replace first element of item's array (text) with array of three elements (text for normal, mouseover and mousedown states). See:

http://www.softcomplex.com/products/tigra_menu_gold/docs/#items_caption
http://www.softcomplex.com/products/tigra_menu_pro/docs/#items_caption

You can modify wrapper function so it accepts additional parameters (colors for all item states) and returns array of three HTML string instead of one HTML string.

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 8/12/2005 at 05:36 PM

Below is improved wrapper function for Tigra Menu PRO and Tigra Menu GOLD. By supporting additional parameters it allows rollover effects.

Code:

function wrap(text, bg_color_off, fg_color_off, bg_color_on, fg_color_on) {

if (!bg_color_on) bg_color_on = bg_color_off;
if (!fg_color_on) fg_color_on = fg_color_off;

return [
'<table cellpadding="0" cellspacing="3" border="0" bgcolor="'
+ bg_color_off + '" width="100%"><tr><td style="padding: 3px; '
+'font-family: tahoma, verdana, arial; font-size: 13px; color:'
+ fg_color_off + '">' + text + '</td></tr></table>',

'<table cellpadding="0" cellspacing="3" border="0" bgcolor="'
+ bg_color_on + '" width="100%"><tr><td style="padding: 3px; '
+'font-family: tahoma, verdana, arial; font-size: 13px; color:'
+ fg_color_on + '">' + text + '</td></tr></table>',

'<table cellpadding="0" cellspacing="3" border="0" bgcolor="'
+ bg_color_on + '" width="100%"><tr><td style="padding: 3px; '
+ 'font-family: tahoma, verdana, arial; font-size: 13px; color:'
+ fg_color_on + '">' + text + '</td></tr></table>'
];
}

MiG

Newbie

Posts: 1
Registered: 12/2/2007
Member Is Offline

posted on 12/5/2007 at 10:30 AM

Does this still work for current versions of tigra menu pro / gold or has the code for these changed since?

And can you use it in combination with rollover images?
I'm using a specific font for my menu layout (and the rest of the site), which, for copyright reasons, I need to rasterize.

The reason I'm asking this is because I'd like the active button to be highlighted as described here (refers to this code as the basis).

tigra

Administrator

Posts: 1920
Registered: 6/17/2002
Location: US, CO
Member Is Offline

posted on 12/5/2007 at 08:30 PM

yep, this is the basic idea of using HTML inside the menu items. It works in all menu versions including current ones.
you can modify the code of the wrapper to add highlight for the current document.