Forum Moderators: not2easy
tr.SelectListRow:hover {
background-color: #000080;
color: #ffffff;
cursor: pointer;
}
I'm using a table inside a scrolling DIV to achieve what a select list won't let me do which is having multiple columns per row. In order to give the user some idea of what row they're pointing at I'm using the above CSS.
It works perfectly except in IE6 where it has no effect at all. Is there a different, perhaps better or more correct way to achieve the same effect that is cross-browser compatible?
Thanks in advance.
I would need to see your code to show you the first method, but it might look something like this...
If the old table cell looks like this...
<td>Some content.</td>
The new one might look like this...
<td><a href="#">Some content.</a></td>
...with the following CSS...
td a {
display:block;
line-height: /*HEIGHT OF THE TD*/;
}
td a:hover{
/*YOUR HOVER STYLES;*/
}
If want to try the JavaScript method, run a search for an article called "Suckerfish Dropdowns." When you find it, go to the end where he discusses getting his dropdown menu to work in IE. You can adapt the JS code he uses to your particular circumstances.
cEM
[added]A third option is to install Dean Edwards' IE7 [dean.edwards.name] on your site. I believe one of the things it fixes is IE's lack of :hover support. Note, however, that his script is JS and will not function on JS-disabled browsers.[/added]
The application I'm writing is a web interface for a program that doesn't have one right now.
Normally I avoid JS completely but in this case it's a necessity as I need to enable/disable menu items depending on what the user is doing and that requires JS.
Since MS has given an (unofficial) nod to IE7 I will give it a try. I really need that :hover pseudo-class to work in IE. Otherwise the user will have no idea what row is selected. Your other suggestion did not seem to do anything in IE.
BTW, I am using jsDOMenu and jsDOMenuBar. I hope it's alright to mention them as they are both free. Is there a better option out there? I don't mind paying for a menu system if there's one out there that is better.
Thanks again for your help.
The following is in the <head> section:
<!-- compliance patch for microsoft browsers -->
<!--[if lt IE 7]>
<script src="/webmefilter/ie7/ie7-core.js" type="text/javascript"></script>
<script src="/webmefilter/ie7/ie7-standard.js" type="text/javascript"></script>
<![endif]-->
Do you know if I'm doing something wrong?
Since this seems to be a JS problem now perhaps this thread needs to be moved to the JS forum?
