Opacity in menu bar vs. menu text

redtopia · Post by **redtopia** » Thu May 17, 2007 11:46 pm

Is it possible to set the opacity of only the background part of the menu, so that the text has a different opacity? I'm running into a problem where I want a bright white text with 100% opacity, and the menu bar with an opacity of 60%. The problem is that when I set an opacity of 60%, I get the effect I want for the menu bar, but then the text is not the bright white that I want.

Thanks,
-JP

Post by **Ruth** » Fri May 18, 2007 6:50 am

Hi,

If you are referring to the overfilter and outfilter settings it applies to all the menu. I think you'd only be able to do that with the use of images for the 'text', though I'm not sure on that. Or you might be able to create bgimages that are 'translucent' and set the bgcolors and menubgcolor to transparent which would only make the images bgs show. But, I do not know how to create such images, sorry.

Ruth

redtopia · Post by **redtopia** » Fri May 18, 2007 3:34 pm

I'm not using overfilter or outfilter because that only works for IE. I'm doing it using CSS as follows:

in menu definition:

offclass="subMenuOff";
onclass="subMenuOn";

in CSS:

.subMenuOn {opacity:1; -moz-opacity:1;}
.subMenuOff {opacity:.90; -moz-opacity:.90;}

Would it be possible to apply a style that will only affect the text?

Post by **Ruth** » Fri May 18, 2007 5:23 pm

Hi,

No, the opacity applies to the whole thing. It's how it functions.

Ruth

redtopia · Post by **redtopia** » Fri May 18, 2007 5:58 pm

Is it possible to apply a separate style to the text? Or is the offclass and onclass the only place where you can assign a CSS class? Or is there another place where perhaps I can apply a CSS style or class?

Post by **Ruth** » Sat May 19, 2007 5:56 am

Hi,

I don't know that there is any css coding to apply opacity to text. It gets applied to the whole object as far as I know [if object is the right word]

I've seen a number of forum help posts in other forums for applying opacity in FF and I think the other is Safari, and IE. All I've seen apply it as you have it in your set up and that applies it to all the stuff to which that class applies. Unless the css site has some explanation of how to apply it to just backgrounds I think that is how it will always work. Sorry.

EDIT: 10:03pm 5/18

One thing that perhaps should be noted, opacity applied through css is totally different than the alpha opacity applied using the overfilter codes. Those alpha opacity overfilter codes rely on directX which is a Microsoft thingee and for that reason they do not apply to the text, as far as I know, but doing it in css you have to apply it in a class and that gets applied to the full object, in this instance the menu, so anything in the menu [meaning also the text] would get the opacity. Now, there is a way to apply that moz opacity to images, however I wouldn't know how you could apply it to a bgimage in the menu???

Code: Select all

<IMG style="-moz-opacity:0.5" src="test.gif">

But as you can see that's not a bgimage.

Ruth