Rollover table backgrounds?

Forum Moderators: open

Message Too Old, No Replies

Rollover table backgrounds?

Allwebco

3:18 am on May 30, 2004 (gmt 0)

Okay, I've been searching google for hours and have come up with squat...Does anyone know of a way to make the background image in a td change on mouseover? All I can seem to find is standard image rollover code, but what I would like to do is put text in front of my rollover image without having to use a div. Can anyone please help? Thanks.
Alec J.

Rambo Tribble

5:24 am on May 30, 2004 (gmt 0)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
td{background:#DEE url(image-name1.gif);width:400px;height:300px;}
</style>
</head>
<body>
<table>
<tr>
<td
onmouseover="this.style.background='#EED url(image-name2.gif)';"
onmouseout="this.style.background='#DEE url(image-name1.gif)';">
</td>
</tr>
</table>

<div style="background-image:url(image-name2.gif);position:absolute;visibility:hidden;"></div>
</body>
</html>

Allwebco

9:47 am on May 30, 2004 (gmt 0)

That works great! Thanks, I really apreciate it!

Allwebco

10:09 am on May 30, 2004 (gmt 0)

Ack...now I have a new problem. Do you know how I can make it affect just one td it wants to change all of them to the image2 background (even if I already have a background on that td, it just puts it right over that one.)

Rambo Tribble

1:15 pm on May 30, 2004 (gmt 0)

You can either make the background image an inline style on the one td or make the style sheet rule apply to a class or id that is only used on the one td.

Allwebco

2:16 pm on May 30, 2004 (gmt 0)

I acutally ended up just making a new page and putting it inside an iframe. I kind of wanted the file to be external anyway. Thanks again! :-)

cyberjunky

10:25 pm on Jun 17, 2004 (gmt 0)

hey guys i too have been searching for something like this for ages, but im having some trouble using it, i made a template page for testing the javascript, but the problem is that the this style piece is mucking the whole page up,

so i removed it and now it looks fine but when i look at the cell images they are just plain colours, i cant see the pictures, i only see colours, i figured out as much as the #dee thing in the code changes the colour, so can you help me make this just work normally without colour changes...?

you can find the example here..

[thegameengine.250free.com...]

where it says "link should be here"
you also got "this is the link background"
and the smae for the button hit to show you what the pictures should look like, if you put the mouse over where it says "link should be here" youl see it does not look like the images to the right...?

Can anyone help me out, it would be gratefuly appreciated,

Thanks in advance, TheGameEngine AKA Cyberjunky