Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.

Dismiss

Change the background image in a table cell

1 view

Skip to first unread message

Jim

unread,

Jul 23, 2008, 3:14:41 PM7/23/08

How can I use JavaScript to change a background image in a table cell?

Here's the code for the cell

You can see that the background is set to the image LEC_Q1.jpg. I
want to change the image LEC_Q1.jpg to LEC_Q1_faded.jpg after a user
clicks a button and the only way I can figure out to do it is by using
JavaScript somehow.

Thomas 'PointedEars' Lahn

unread,

Jul 23, 2008, 3:24:33 PM7/23/08

1. refToTD.background = "...";

2. You want to use CSS and

refToTD.style.backgroundImage = "url(...)";

instead.

3. You don't want to use an empty table cell here, and probably also not
tables in the first place, but a properly positioned `img' element
instead. A table is a table is a table. [psf 3.8]

PointedEars
--
var bugRiddenCrashPronePieceOfJunk = (
navigator.userAgent.indexOf('MSIE 5') != -1
&& navigator.userAgent.indexOf('Mac') != -1
) // Plone, register_function.js:16

SAM

unread,

Jul 23, 2008, 9:19:31 PM7/23/08

Jim a écrit :

> How can I use JavaScript to change a background image in a table cell?
>
> Here's the code for the cell
>
> <td width="338" valign="top" background="../images/
> LEC_Q1.jpg"><div align="right"></div></td>
>
> You can see that the background is set to the image LEC_Q1.jpg. I
> want to change the image LEC_Q1.jpg to LEC_Q1_faded.jpg after a user
> clicks a button

<td width="338" valign="top"

style="background:url(../images/LEC_Q1.jpg)no-repeat center center"
onmouseover="this.style.backgroundImage='url(../images/LEC_Q1_faded.jpg)';"
onmouseout="this.style.backgroundImage='url(../images/LEC_Q1.jpg)';">

<button
onclick="document.getElementById('td_1').style.backgroundImage='url(../images/LEC_Q1_faded.jpg)';">
change td_1's image</button>

--
sm

0 new messages