SitePoint Sponsor |
|
User Tag List
Results 1 to 9 of 9
Thread: Rollover TD
-
Sep 11, 2007, 17:23 #1
- Join Date
- Dec 2006
- Location
- On the internets
- Posts
- 191
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Rollover TD
Hey guys,
Anybody know any tricks for getting rollover td's to work in IE without javascript?
This is my CSS
.rollover1
{
background-color:#FFFFFF;
background-image:url(/site_images/bg.jpg);
background-repeat:repeat-x;
background-position:bottom;
}
.rollover1:hover
{
background-color:#FFFFFF;
background-image:url(/site_images/bg2.jpg);
background-repeat:repeat-x;
background-position:bottom;
}
I'm obviously applying it to a TD tag and it works in some browsers but not others. I know that :hover is meant to only work on A tags in IE but are than any tricks I can use to get this to work?
thanks,
Chris
-
Sep 11, 2007, 17:54 #2
- Join Date
- Sep 2006
- Location
- Gold Coast, QLD
- Posts
- 359
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
not that i know of.
you could always style an a tag as a block element in the table cells place instead tho which would then work in IEHeavens Rejects : Online Clothing Store
Alternative Clothing : Mr Blonde
Front end development : By the Webfella
-
Sep 11, 2007, 18:48 #3
- Join Date
- May 2006
- Location
- Aurora, Illinois
- Posts
- 15,476
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Note that you don't have to worry about this in IE 7, but in IE 6 you're best off using a .htc file.
Save the Internet - Use Opera | May my mother rest in peace: 1943-2009
Dan Schulz - Design Team Advisor | Follow me on Twitter
SitePoint References: HTML CSS JavaScript | Become A Guru
WordPress SEO Checklist | What WordPress Plugins Do You Use?
Web Standards Curriculum | Image Free Equal Height Columns
-
Sep 11, 2007, 21:30 #4
-
Sep 12, 2007, 01:45 #5
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi,
Or you could use the same JS routine that's used in the suckerfish menus to apply the hover to table elements instead.
e.g.
http://www.pmob.co.uk/temp/table-highlight.htm
-
Sep 12, 2007, 11:50 #6
- Join Date
- May 2006
- Location
- Aurora, Illinois
- Posts
- 15,476
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I'd rather not, Paul. It doesn't do any good for :focus and :active states, whereas the .htc file takes care of those as well.
Save the Internet - Use Opera | May my mother rest in peace: 1943-2009
Dan Schulz - Design Team Advisor | Follow me on Twitter
SitePoint References: HTML CSS JavaScript | Become A Guru
WordPress SEO Checklist | What WordPress Plugins Do You Use?
Web Standards Curriculum | Image Free Equal Height Columns
-
Sep 12, 2007, 12:38 #7
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
I'd rather not, Paul. It doesn't do any good for :focus and :active states, whereas the .htc file takes care of those as well.
Also the fact that a lot of general users users may not have access to their htc files anyway.
Anyway you can add active and focus states to the routine if you want as after all the behaviour is just a javascript file anyway.
-
Sep 13, 2007, 12:56 #8
- Join Date
- Dec 2006
- Location
- On the internets
- Posts
- 191
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hey Dan,
I'm still very much interested in your explination of how to use an htc file to help with this issue. The main reason why I don't want to use javascript is because this css class is already used across a very large site and I'd much rather edit/tweak/hack the css than go and edit every single page that referrences the rollover class.
thanks again,
Chris
-
Sep 13, 2007, 13:00 #9
- Join Date
- May 2006
- Location
- Aurora, Illinois
- Posts
- 15,476
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
This will explain what you need to know.
http://www.xs4all.nl/~peterned/csshover.htmlSave the Internet - Use Opera | May my mother rest in peace: 1943-2009
Dan Schulz - Design Team Advisor | Follow me on Twitter
SitePoint References: HTML CSS JavaScript | Become A Guru
WordPress SEO Checklist | What WordPress Plugins Do You Use?
Web Standards Curriculum | Image Free Equal Height Columns
Bookmarks