[BC3] [JavaScript] background image wijzigen in een td

[Verwijderd]

Ik wil in een td de background wijzigen. Met this.background spreek je de achtergrondkleur aan, maar is het mogelijk om de backgroundimage in een td aan te spreken? Je kan nl. ook geen name="" meegeven.

[Dennis]

De stylesheet moet je aanpassen zoals this.style.?

[Verwijderd]

Was het maar waar

Heb het als volgt al geprobeerd in de OnClick. Hij gaf geen kik in MSIE

this.style.background-image=url(images/tab_bg_on.gif);

[Verwijderd]

Heb overigens zojuist gecheckt met alert

alert(this.style.background-image);

maar kreeg dus een image not defined terug.

[Dennis]

Op dinsdag 15 mei 2001 16:19 schreef Gordijnstok het volgende:
Heb overigens zojuist gecheckt met alert

alert(this.style.background-image);

maar kreeg dus een image not defined terug.

Dat is behoorlijk jammer
Ik vraag me dan idd. af of het wel mogelijk is.

[Verwijderd]

Dat komt omdat in JS de min (-) al is gereserveerd:
this.style.background-image wordt: this.style.backgroundImage

[Verwijderd]

Op dinsdag 15 mei 2001 16:35 schreef Blues het volgende:
Dat komt omdat in JS de min (-) al is gereserveerd:
this.style.background-image wordt: this.style.backgroundImage

Dat werkt dus niet, had het ook al geprobeerd, krijg een alert terug zonder content.

Ik heb de background om 2 manieren gedefinieerd. In de stylesheet met:

.tabon {font-family: arial; font-size:11px; color: white; background-image:url(images/tab_bg_on.gif);}

en ook nog als basic bg in de td met

<td class="tab" background="images/tab_bg_on.gif">

Ik heb het eerst om en om geprobeerd, en daarna dubbelop. Beide werkten niet.

Ik heb tevens geprobeerd om de background in de Stylesheet op backgroundImage:url(images/tab_bg_on.gif); te definieren. Niets werkt.

[Dennis]

Op dinsdag 15 mei 2001 16:49 schreef Gordijnstok het volgende:

[..]

Dat werkt dus niet, had het ook al geprobeerd, krijg een alert terug zonder content.

Ik heb de background om 2 manieren gedefinieerd. In de stylesheet met:

.tabon {font-family: arial; font-size:11px; color: white; background-image:url(images/tab_bg_on.gif);}

en ook nog als basic bg in de td met

<td class="tab" background="images/tab_bg_on.gif">

Ik heb het eerst om en om geprobeerd, en daarna dubbelop. Beide werkten niet.

Ik heb tevens geprobeerd om de background in de Stylesheet op backgroundImage:url(images/tab_bg_on.gif); te definieren. Niets werkt.

Heej let wel ff op!!!! Iets dat in een stylesheet is gedefineerd kan nooit door een "gewone" waarde worden overschreven.

[AxiMaxi]

Check hier:

How can I dynamically change the background image?

{edit}ik bedoelde deze:
How do I dynamically change a style attribute in a CASCADED style element? (eg: elementRef.style.backgroundImage)
{/edit}

{edit 2}
En sorry dat ik steeds m''n naam eronder zet, maar dat is automatisme.
(''t is ook de eerste keer dat ik er commentaar op krijg, trouwens)
{/edit 2}

[Verwijderd]

Op dinsdag 15 mei 2001 16:51 schreef dennisdotcom het volgende:

[..]

Heej let wel ff op!!!! Iets dat in een stylesheet is gedefineerd kan nooit door een "gewone" waarde worden overschreven.

Waar haal je dat dan vandaan? Even een lomp voorbeeld. Als je een layer in een stylesheet als visible definieert kun je hem daarna gewoon op hidden zetten hoor.

[Dennis]

Op dinsdag 15 mei 2001 16:54 schreef AxiMaxi het volgende:
Check hier:

How can I dynamically change the background image?

grtz.
AxiMaxi

De vraag is : kan dit ook in een tabel-cel.
En niet svp steeds je naam eronder posten, zie faq

[Verwijderd]

Op dinsdag 15 mei 2001 16:54 schreef AxiMaxi het volgende:
Check hier:

How can I dynamically change the background image?

{edit}ik bedoelde deze:
How do I dynamically change a style attribute in a CASCADED style element? (eg: elementRef.style.backgroundImage)
{/edit}

grtz.
AxiMaxi

Hier stoppen ze dus het hele mutje in een layer. En dat wil ik juist niet doen, sterker nog, kan het niet doen.

[Dennis]

Op dinsdag 15 mei 2001 16:55 schreef Gordijnstok het volgende:

[..]

Waar haal je dat dan vandaan? Even een lomp voorbeeld. Als je een layer in een stylesheet als visible definieert kun je hem daarna gewoon op hidden zetten hoor.

Ik heb dit zelf ondervonden bij het gebruik met javascript. Jij als web-pro zal wel weten wat ik bedoel met tabel-cell rollovers dus dat ga ik niet uitleggen.

Stel je hebt zo iets ingebouwd op een pagina en diezelfde cel heb je de background-color gedefineerd in een stylesheet. Als je dan met JS de this.bgcolor verandert werkt het niet, omdat het al in de stylesheet staat.

Daardoor weet ik het. Maar heb ik het fout dan volgens jou?

[Verwijderd]

Op dinsdag 15 mei 2001 16:57 schreef dennisdotcom het volgende:

[..]

Ik heb dit zelf ondervonden bij het gebruik met javascript. Jij als web-pro zal wel weten wat ik bedoel met tabel-cell rollovers dus dat ga ik niet uitleggen.

Stel je hebt zo iets ingebouwd op een pagina en diezelfde cel heb je de background-color gedefineerd in een stylesheet. Als je dan met JS de this.bgcolor verandert werkt het niet, omdat het al in de stylesheet staat.

Daardoor weet ik het. Maar heb ik het fout dan volgens jou?

Ermm... ja Ik heb bijvoorbeeld een table layout gemaakt waar de td''s allemaal een style hebben. Als je over een desbetreffende td gaat wordt de backgroundcolor gewijzigd, ondanks dat deze in de style hard gecodeerd staat.

[Dennis]

Heb je het via de stylesheet veranderd of zoals ik zeg via bgcolor?

[Verwijderd]

Op dinsdag 15 mei 2001 16:49 schreef Gordijnstok het volgende:
Dat werkt dus niet, had het ook al geprobeerd, krijg een alert terug zonder content.

code:

<table>
<tr>
<td style="background-image:url(a.gif);" onclick="this.style.backgroundImage='url(b.gif)';">
TEST
</td>
</tr>
</table>

Wat werkt hier niet aan dan

[Ultra]

Op dinsdag 15 mei 2001 17:52 schreef Blues het volgende:

[..]

code:

<table>
<tr>
<td style="background-image:url(a.gif);" onclick="...">
TEST
</td>
</tr>
</table>

Wat werkt hier niet aan dan

Cellen zijn alleen in IE clickable geloof ik

[Verwijderd]

Op dinsdag 15 mei 2001 18:03 schreef venoxxx het volgende:
Cellen zijn alleen in IE clickable geloof ik

DUH! Sowieso is alles wat met een TD heeft te maken in Netscape niet scriptable dus daar had ik ook helemaal geen rekening mee gehouden.

Op dinsdag 15 mei 2001 15:07 schreef Gordijnstok het volgende:
...maar is het mogelijk om de backgroundimage in een td aan te spreken? Je kan nl. ook geen name="" meegeven.

Ja, het is mogelijk. Je kan wel een ID="" meegeven aan je TD, zodat je die in IE als document.all.tdNaam kunt benaderen...

[Verwijderd]

Op dinsdag 15 mei 2001 17:52 schreef Blues het volgende:

[..]

code:

<table>
<tr>
<td style="background-image:url(a.gif);" onclick="this.style.backgroundImage='url(b.gif)';">
TEST
</td>
</tr>
</table>

Wat werkt hier niet aan dan

Ik ga dat morgen eens nakijken en uitproberen, het is nu te laat

Alvast bedankt voor de moeite, waarom het bij mij niet werkte weet ik niet maar dat merk ik morgen als mijn source doorlees wel.

Overigens wordt het een Msie only applicatie dus dat maakt niet uit. Evt. Ns6 maar volgens mij werkt het daar ook wel in.


Het enige wat ik uit mijn gedachten kan opvissen was dat ik dit anders had in de td.
style="background-image:url(a.gif);

ik had hier hardcoded zonder gebruik van style background="" ingezet, en heb het ook op de class="stylenaam" gedaan met hierin dus style="background-image:url(a.gif);. Misschien dat het gebruik van class wat zaakjes in de weg zat met scripting en aanroepen.

[Verwijderd]

En toen kwamen we dus een leuke css misser tegen. Zolang je de background hard in de td zet, met style="" werkt het wel. Zodra je met class="stylenaam" de style aanroept werkt het niet meer!

Welkom nieuwe css bug!

[Verwijderd]

Kan trouwens ook zonder styles:

code:

<td background="a.gif" id="testTD">
<a href="" onmouseover="document.all.testTD.background='b.gif';">TEST</a>
</td>

[Verwijderd]

Verwijderd schreef op 16 mei 2001 @ 11:46:
Kan trouwens ook zonder styles:

code:

<td background="a.gif" id="testTD">
<a href="" onmouseover="document.all.testTD.background='b.gif';">TEST</a>
</td>

Deze werk ja, maar als je er met je muis weer vanaf gaat blijft de onmouse over image hangen, hij springt niet meer terug. Iemand een idee hoe dat moet??

[gorgi_19]

onmouseout event gebruiken, net zoals je onmouseover doet?

[ Voor 47% gewijzigd door gorgi_19 op 08-08-2003 17:11 ]

[crisp]

Verwijderd schreef op 08 augustus 2003 @ 17:04:
[...]

Deze werk ja, maar als je er met je muis weer vanaf gaat blijft de onmouse over image hangen, hij springt niet meer terug. Iemand een idee hoe dat moet??

Kijk eens naar de datum van het topic

document.all = oud en achterhaald, daar hebben we tegenwoordig DOM voor
background als attribuut = oud en achterhaald, daar hebben we tegenwoordig CSS voor

[drm]

what he said ^^^