Table-tag

[Nattydreadlock]

Hello,

I have a little question which should be easy, nevertheless i can't
solve the problem.

I want to change the background of a <td>-tag when you click on a link
in the html-page.

This is what I've got but it doesn't work:

<script type="text/javascript">
function change()
{
var x=document.getE lementById('tab le').rows
var y=x[0].cells
y[0].background="../images/knoplinks.gif"
}

<script>

<table id="tabel">
<tr>
<td background="../images/knop2.gif">
<a href="#" onclick="change ()">Gegevens</a>
</td>
</tr>
</table>

[Joakim Braun]

Re: Table-tag

"Nattydreadlock " <Bertengele@hot mail.com> skrev i meddelandet
news:1111753666 .499975.111290@ z14g2000cwz.goo glegroups.com.. .[color=blue]
> Hello,
>
> I have a little question which should be easy, nevertheless i can't
> solve the problem.
>
> I want to change the background of a <td>-tag when you click on a link
> in the html-page.
>
> This is what I've got but it doesn't work:
>
> <script type="text/javascript">
> function change()
> {
> var x=document.getE lementById('tab le').rows[/color]

Add ";"
[color=blue]
> var y=x[0].cells[/color]

Add ";"
[color=blue]
> y[0].background="../images/knoplinks.gif"[/color]

Add ";"
And you probably want "y[0].style.backgrou nd =
url(../images/knoplinks.gif)" .
(or "y[0].style.backgrou ndImage....".)
[color=blue]
> }
>
> <script>[/color]

Should be: "</script>".
[color=blue]
> <table id="tabel">[/color]

But you wrote "getElementById ('table')".
[color=blue]
> <tr>
> <td background="../images/knop2.gif">[/color]

<td> doesn't have a background attribute (at least not in HTML 4.0).
Perhaps you want "<td style="backgrou nd-image:url(../images/knop2.gif)">".
[color=blue]
> <a href="#" onclick="change ()">Gegevens</a>
> </td>
> </tr>
> </table>[/color]

--
Joakim Braun

[Nattydreadlock]

Re: Table-tag

Hello,

I checked the syntax problems but still it doesn't work. I tried
different things but I couldn't find the solution yet.
Here is what I think is closest to the solution

<script type="text/javascript">
function change()
{
var x=document.getE lementById('tab el').rows;
var y=x[0].cells;
y[0].style = "background-image:url(../images/knop2klik.gif)" ;
}
</script>


<table id="tabel">
<tr>
<td style="backgrou nd-image:url(../images/knop2.gif)">
<a href="#" class="navlinks "
onclick="change ()">Gegevens</a>
</td>
</tr>
</table>

[Ivo]

Re: Table-tag

"Nattydreadlock " wrote[color=blue]
>
> y[0].style = "background-image:url(../images/knop2klik.gif)" ;[/color]

Make that:
y[0].style.backgrou ndImage = "url(../images/knop2klik.gif)" ;

with an uppercase i.

hth
--
Ivo

[Michael Winter]

Re: Table-tag

On 25/03/2005 12:27, Nattydreadlock wrote:

[snip]
[color=blue]
> I want to change the background of a <td>-tag when you click on a link
> in the html-page.[/color]

Make sure that if you set a background image, you also set both a
background and foreground colour. You shouldn't rely on defaults in
case a user doesn't have those same defaults.

[snip]
[color=blue]
> y[0].background="../images/knoplinks.gif"[/color]

Use the backgroundImage property of the style object, and the url(...)
functional notation, as shown in Ivo's post.

[snip]
[color=blue]
> <a href="#" onclick="change ()">Gegevens</a>[/color]

You'll probably want to cancel the click event. Return false from the
listener:

onclick="change (); return false;"

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.