Hi,

Does anyone know how to change an entire CSS Selector using JavaScript?

I have the following CSS in /styles/navigate.css:

 
#ulNavigate li {
 background-image: url(../images/nav_li_bg.png);
 background-repeat: no-repeat;
 margin-top: 3px;
 padding: 0px;
 list-style: none;
 width: 132px;
 height: 26px;
}

As you can see, the background image is a PNG. This is because it has a drop shadow and is going to be placed over a gradient.

I have a bt of Browser Detection, and what I want to do, is take away the background-image element and replace it with a DirectX Filter. I can do ths if I know the ID of each of the LI elements, but I don't - they're generated dynamiclly and I don't give them an ID.

Any ideas?

I guess you want to use different code for IE, right?

http://www.webmaster-talk.com/showthread.php?t=18295

The Star CSS Bug worked to put the filter in for IE, however it overlays it with the origional background image. How do I use CSS to turn it off? (One way is setting the background-position to push it out, but if there's something more relavant I'd rather use it, I'm a bit of a perfectionist)

Also, minor problem, the CSS won't validate now there's a filter: attribute in there, which is why I wanted to use JavaScript.

you could use

background: transparent;

Edit:

Also, minor problem, the CSS won't validate now there's a filter: attribute in there, which is why I wanted to use JavaScript.

In my opinion, invalid CSS is better than using JavaScript for the same purpose. Since it's under "* html" (which actually also is invalid, since html is the root element) it will be ignored by all css compliant browsers except for IE (well, IE isn't really css compliant...).

If you want to use valid code then you will also have to ignore IE...