Tekst kleur veranderen

[Verwijderd]

Ik heb een tabel, met daarin een menu'tje. Als je met je muis over de cel gaat, moet de de kleur van de tekst in de cel veranderen en moet de tekst vet worden. Het is natuurlijk heel simpel, maar ik kom er niet uit. Ik zat aan iets te denken als:

code:

<TD onMouseOver="this.style.color = 'red';this.style.bold();">Tekst</TD>

, maar dat werkt niet. Wat werkt er wel?

[Willem]

Je kunt het ook met default CSS elementen oplossen:

code:

a {
  font-color: #ff0000;
}

a:hover {
  font-color: #0000ff;
}

_{/edit
Sorry, verkeerd begrepen.}

[Yo-han]

code:

a {
  font-color: #ff0000;
}

a:hover {
  font-color: #0000ff;
}

en deze code kan je in een stylesheet zetten....

hoef je alleen maar

code:

<span class="ahover">.......(link......</span>

te gebruiken

[RM-rf]

code:

onmouseover="
this.style.color='red';
this.style.bold()
"

die eerste is goed, echter hoe kom je op die tweede?

als je de opzet van de eerste zou aanhouden kune makkelijk op een goede manier komen:

de text-dikte wordt in CSS bepaald door font-weight: wil je die als javascript propertie aanspreken dien je style.fontWeight te gebruiken

hiermee zou het moeten lukken

Willem169 helaas wordt in browser enkel de :hover pseudo-class ondersteund voor de A-tag, mogelijk kent Opera6 of mozilla het ook voor TD, maar msie zeker niet

[Verwijderd]

Ja, zou ook kunnen, maar ik wil ook gelijk de achtergrondkleur van de cel veranderen en dan hou ik het op deze manier een beetje bij elkaar.

Als het niet anders kan, doe ik het gewoon met CSS, maar het lijkt me toch dat zoiets moet kunnen...

[Verwijderd]

Hey, ja, het werkt IDD, die eerste. Ik had een typ-voutje gemaakt, vandaar dat het niet werkte.

Die tweede: ik had hem nog niet geprobeerd, maar volgens mij had ik ooit eens zoiets gelezen......

[Yo-han]

Willem169 helaas wordt in browser enkel de :hover pseudo-class ondersteund voor de A-tag, mogelijk kent Opera6 of mozilla het ook voor TD, maar msie zeker niet

hoe bedoel je dat.....?

Want als ik in me TD 'ahover' gebruik heb ik nooit problemen.....

[Verwijderd]

Voorbeeldje:

code:

<TD style="background-color:lightblue; font-weight: normal"
 onMouseover="this.style.backgroundColor='yellow'; this.style.fontWeight='bold'"
 onMouseout="this.style.backgroundColor='lightblue'; this.style.fontWeight='normal'">
Woef!
</TD>

(met dank aan RM-rf en http://www.pageresource.com/dhtml/jtut6.htm )

...en het zal niet crossbrowser werken vermoed ik.

[Verwijderd]

code:

onmouseover="
this.style.color='red';
this.style.bold()
"

die eerste is goed, echter hoe kom je op die tweede?

Dat komt hier vandaan:
http://developer.netscape.com/docs/manuals/communicator/jsref/index.htm

Maar dat zal hier wel niet werken.

[Yo-han]

ik denk dat ik gewoon lekker hopie hopeloos bij me ouwe manier blijf...

code:

<td border="0"><span class="ahover"><a href="bladiebla.html">bladiebla</a></span>

werkt altijd en goed, enige wt je hoeft te doen is een stylesheet maken die je elke keer kan gebruiken en alleen hoeft aan te passen

[Verwijderd]

Maareuh..... in ieder geval: RM-rf en de anderen, bedankt voor de reacties......

Het was eigenlijk zo simpel dat ik zelf uit had moeten komen

[Willem]

RM-rf:
willem169 helaas wordt in browser enkel de :hover pseudo-class ondersteund voor de A-tag, mogelijk kent Opera6 of mozilla het ook voor TD, maar msie zeker niet

Hoe bedoel je dat nou? Ik heb nog nooit problemen gehad hiermee...

/edit
Ik bedoel, ik heb het over text linkjes hè.. die werken met a:hover allemaal prima: Netscape, Opera en IE (uiteraard gewoon ook...)

En inderdaad, als je een < td > background color wilt veranderen moet je het zoals gezegd met classes doen this.className = class; (werkt wel in IE)

[Yo-han]

dat vroeg ik dus net ook al maar krijg geen antwoord

[RM-rf]

Op donderdag 14 maart 2002 14:51 schreef Popeye the Sailor het volgende:

Dat komt hier vandaan:
http://developer.netscape.com/docs/manuals/communicator/jsref/index.htm

Maar dat zal hier wel niet werken.

zoals je in de url ziet is dat de javascript-documentatie van communicator.

de bur method is meen ik een string-method die door communicator bij gebrek aan het style-object toegepast wordt
(communicator kan dus ook geen dynamische aanpassing van elementen aan, anders dan door het element opnieuw te writen via een document.layers['blaat'].document.write(variabeleMetJeText.bold()))

je kunt de code die Milkman_dan postte best een onmouseover over een hele TD doen: dit werkt in iedere enigszins DOM-0 ondersteunende browser, da's qua toegepastte browsers alles behalve ns4x, nu ondersteund de laatste geheel geen onmouseover in een TD dus krijg je dr ook geen errors in

edit: className is géén DOM (meen ik), voor DOM-browsers dien je dan te werken met this.setAttribute("class", "newClass")

[Verwijderd]

Op donderdag 14 maart 2002 15:10 schreef RM-rf het volgende:


edit: className is géén DOM (meen ik), voor DOM-browsers dien je dan te werken met this.setAttribute("class", "newClass")

ik weet het nog niet zo RM-rf, want dit werkt dus zowel in IE als in Mozilla:

javascript:

code:

function chStyle (what , how) 
 {
  what.className = how;
  }

css:

code:

.normal { cursor: pointer; text-decoration: none; font-size: 9px; color: #ffffff;  font-weight: bold; background-color: #6992b3;  }

.hover { cursor: pointer; text-decoration: none; font-size: 9px; color: #ffffff; font-weight: bold; background-color: #055285; }

en de HTML code:

code:

<td  onMouseOut="chStyle(this,'normal');" onMouseOver="chStyle(this,'hover');">

dus misschien is het wel een onderdeel van de DOM ?