Baggrundsfarve på en tabel-celle

<html>
<SCRIPT LANGUAGE=\"JavaScript\" TYPE=\"text/javascript\">
<!--
ns  = (document.layers) ? true : false;
ns6 = (document.getElementById) ? true : false;
ie  = (document.all) ? true : false;

function changeColor( tdName, color ){
  if( ie ){
        document.all[tdName].style.backgroundColor=color;
    } else if( ns ){
      // Her er det litt tricky...
    } else if( ns6 ){
      document.getElementById(tdName).style.backgroundColor=color;
    }
}
//-->
</SCRIPT>
<body>
<table border=\"1\">
<tr>
    <td id=\"one\">one</td>
</tr>
<tr>
    <td id=\"two\">two</td>
</tr>
</table><br>
<a href=\"java script:void(changeColor(\'one\', \'#FF0000\'));\">Farg celle \'one\' rød</a><br>
<a href=\"java script:void(changeColor(\'one\', \'#00FF00\'));\">Farg celle \'one\' grønn</a><br>
<a href=\"java script:void(changeColor(\'two\', \'#FF0000\'));\">Farg celle \'two\' rød</a><br>
<a href=\"java script:void(changeColor(\'two\', \'#00FF00\'));\">Farg celle \'two\' grønn</a><br>

</body>
</html>

hmmm...den fungerer *ikke* i NS4...grunnen til det er at styles i NS4 er readonly, og man skal kode litt utenom det vanlige for å få det til å spille *helt* som man vil...

Hvis du kan få det til at spille i NS4, så er mere end tilfreds!

jeg kikker på det...men det tar *litt* mer tid :)

Fedt, jeg tror bare desværre at du/jeg *skal* have gang i noget med nogle layers :-(

yup....og det er du *nødt* til...er det et problem ?

så er den der i IE5, ns4, ns6, mozilla ( desverre ikke i opera )..det får eg heller ta i morgen...

<html>
<SCRIPT LANGUAGE=\"JavaScript\" TYPE=\"text/javascript\">
<!--
ns  = (document.layers) ? true : false;
ns6 = (document.getElementById) ? true : false;
ie  = (document.all) ? true : false;

function changeColor( tdName, color ){
  if( ie ){
        document.all[tdName].style.backgroundColor=color;
        eval(\"document.all[\'div\" + tdName + \"\']\").style.backgroundColor=color;
    } else if( ns ){
      document.layers[\'div\' + tdName].document.bgColor = color;
    } else if( ns6 ){
      document.getElementById(tdName).style.backgroundColor=color;
        eval(\"document.getElementById(\'div\" + tdName + \"\')\").style.backgroundColor=color;
    }
}
//-->
</SCRIPT>
<body>
<table border=\"1\">
<tr>
    <td id=\"One\"><div name=\"divOne\" id=\"divOne\" style=\"position:relative;top:0px;left:0px;background-color:#ffffff;layer-background-color:#ffffff;\">one</div></td>
</tr>
<tr>
    <td id=\"Two\"><div name=\"divTwo\" id=\"divTwo\" style=\"position:relative;top:0px;left:0px;background-color:#ffffff;layer-background-color:#ffffff;\">two</div></td>
</tr>
</table><br>
<a href=\"java script:void(changeColor(\'One\', \'#FF0000\'));\">Farg celle \'one\' rød</a><br>
<a href=\"java script:void(changeColor(\'One\', \'#00FF00\'));\">Farg celle \'one\' grønn</a><br>
<a href=\"java script:void(changeColor(\'Two\', \'#FF0000\'));\">Farg celle \'two\' rød</a><br>
<a href=\"java script:void(changeColor(\'Two\', \'#00FF00\'));\">Farg celle \'two\' grønn</a><br>

</body>
</html>

/nute

nja....den var vel ikke *helt* perfekt...bytt ut:

<td id=\"One\"><div name=\"divOne\" id=\"divOne\" style=\"position:relative;top:0px;left:0px;background-color:#ffffff;layer-background-color:#ffffff;\">one</div></td>

med:

<td id=\"One\" width=\"50\" height=\"20\"><div name=\"divOne\" id=\"divOne\" style=\"position:relative;top:0px;left:0px;clip:rect(0,50,20,0);background-color:#ffffff;layer-background-color:#ffffff;\">one</div></td>

og denne:

<td id=\"Two\"><div name=\"divTwo\" id=\"divTwo\" style=\"position:relative;top:0px;left:0px;background-color:#ffffff;layer-background-color:#ffffff;\">two</div></td>

med denne:

<td id=\"Two\" width=\"50\" height=\"20\"><div name=\"divTwo\" id=\"divTwo\" style=\"position:relative;top:0px;left:0px;clip:rect(0,50,20,0);background-color:#ffffff;layer-background-color:#ffffff;\">two</div></td>

så spiller den bedre.

Legg merke til at jeg har lagt til height/width i <td> tagget og clip:rect(0,50,20,0); i <div> tagget. Pass på at width i <td> stemmer overens med det andre argumentet i rect() og at height i <td> stemmer overens med det tredje argumentet i rect()

God natt...

/nute

<ole>
nute >> Dine \'eval()\' er overflødige og det er en ret langsom funktion. Bare skriv:
  document.all[\"div\" + tdName].style.backgroundColor=color;
Styles er ikke readonly i NS4.x, men <td> indgår - blandt mange andre elementer - ikke i den adresserbare del af DOM\'en...resultatet er det samme  :)
/mvh
</bole>

Takker for din tid nute, jeg tjecker det her iaften, og giver dig point derefter ;o)

Ps. nej layers er intet problem udover at jeg ikke kan finde ud af at arbejde med dem =)

Pps. oxo tak til ole bole for den altid så hjælpende hånd!

/KingManon

olebole >> du har rett med hensyn til eval()...det begynte å bli relativt sent på natt etter en laaaaang dag, og mitt hode klarte ikke å tenke mer :-)

Apropos <td>...du har vel ikke tilfeldigvis en link til noe dokumentasjon om din påstand ? Ikke det at jeg ikke tror på deg (det gjør jeg i 99% av tilfellene =o) ), men for å selv finne ut av hvilke elementer jeg kan eller ikke kan adressere

/nute

Jeg er ikke sikker på denne her, men virker bgColor i HTML ikke i NS?

<script>
function skiftFarve(farve,el) {
document.el.bgColor = farve;
}
</script>

HTML\'et kan se fx sådan her ud:

<table>
<tr>
<td bgColor=\"green\" name=\"td1\"></td>
</tr>
</table>

<a href=\"java script:skiftFarve(\'red\',\'td1\')\">Skift farve!</a>

phoenixv >> leg olebole sitt innlegg @ 18/09 2001 02:59:03. Man kan ikke tilgå styles i et <td> tag på samme måte som i IE5+ og NS6. Derfor er man nødt til å legge et layer inn i hver tabellcelle som man skifter bakgrunnsfarge på

:)

phoenixv >> Iøvrigt er \'bgColor\' ikke HTML...det er JavaScript  :)

nute >> Du kan altid konkatinere en streng og en variabel, når du kalder i et array. Derfor er der ikke brug for \'eval()\', når man skal lave en dynamisk objekt reference.
/mvh

olebole >> joda...*det* er jeg  *fullstendig* klar over :-) det jeg spurte om (eller iallefall prøvde å spøøre om) var en eller annen dokumentasjon på *hvilke* elementer man kan adressere i NS. Med andre ord...du skriver:

\"Styles er ikke readonly i NS4.x, men <td> indgår - blandt mange andre elementer - ikke i den adresserbare del af DOM\'en\"

Jeg spør:

\"hvordan vet du dette ? HVor har du lest om dette ?\"

=0)

I princippet har du kun adgang til, hvad der ligger i \'layers\' array\'et. Det kommer lidt an på, hvad du vil tilgå dem til. Du kan f.eks. godt kalde et link med:
  document.links[0]
Men jeg tvivler på, du kan style linket med CSS via JavaScript...har ikke en NS4 på denne maskine, så prøv selv  :)
Jeg har ikke noget online-doku på emnet...bruger i tvivlstilfælde \'The Rhino\' fra O\'Reilly  :)
/mvh

Du kan også søge i Netscape\'s egen JavaScript dokumentation  :)

ahh...setningen \"I princippet har du kun adgang til, hvad der ligger i \'layers\' array\'et\" var nok \"dokumentasjon\" for meg. Det er da logisk nok :)

denne her:

<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\">
<html>
<head>
    <title>Untitled</title>
<SCRIPT LANGUAGE=\"JavaScript\" TYPE=\"text/javascript\">
<!--
function changeStyle(){
  document.ids.test.color = \'red\';
}
//-->
</SCRIPT>
</head>
<body>
<a href=\"java script:void(null);\" id=\"test\">Test</a><br>
<br>
<a href=\"java script:void(changeStyle())\";\">change</a>
</body>
</html>

skulle vel i prinippet kunne fungere i NS. Merkelig nok så fungerer det ikke, men det genererer heller ingen feil :-| (noe den gjør i IE)

/nute

Nej, nute....hvad laver du nu? Det der skulle i princippet *netop* ikke fungere...noget sted  :)

function changeStyle(){
  document.links[\'test\'].color = \'red\';
}

Kunne i teorien have virket, men jeg tro kun, du kan få fat i: \'hash\', \'host\', \'hostname\', \'href\', \'pathname\', \'port\', \'search\', \'target\', \'text\', \'x\' og \'y\' på et link  :)
/mvh

Jeg tror hovedsageligt kun du kan style på ting (dynamisk), du kan nå med:
  document.layers[enID]
...altså <div>, <span> og <layer>.
/mvh

nja...du har nok desverre korrekt. jeg kortsluttet litt. Meeen...grunnen til at jeg mente deg *kunne* går, var nettopp fordi \'document.ids\' returnerer et Style object.

*leser litt mer om dynamisk styling*

Men takk for at du kastet lys over tingene :-)

I NS4.x eksisterer style-objektet ikke som tilgængeligt objekt...det gør det i IE4+ og NS6+:
  document.all[enID].style
/mvh

Hej gutter!

I går da helt amok ;o)
Men keep up the good work, jeg er sikker på at vi kan få det her til at virke optimalt!!!

/KingManon som er imponeret over folks viden, og sin egen åbenbare uvidenhed =o)

kingmanon >> vi diskuterer bare noen generelle ting :-) Selve scriptet fungerer sånn som det står, men for at du skal kunne få utbytte av denne lille diskusjonen vi har hatt, så poster jeg den nye versjonen som skal fungere \"optimalt\":

<html>
<SCRIPT LANGUAGE=\"JavaScript\" TYPE=\"text/javascript\">
<!--
ns  = (document.layers) ? true : false;
ns6 = (document.getElementById) ? true : false;
ie  = (document.all) ? true : false;

function changeColor( tdName, color ){
  if( ie ){
        document.all[tdName].style.backgroundColor=color;
        document.all[\"div\" + tdName ].style.backgroundColor=color;
    } else if( ns ){
      document.layers[\'div\' + tdName].document.bgColor = color;
    } else if( ns6 ){
      document.getElementById(tdName).style.backgroundColor=color;
        document.getElementById(\"div\" + tdName).style.backgroundColor=color;
    }
}
//-->
</SCRIPT>
<body>
<table border=\"1\">
<tr>
    <td id=\"One\" width=\"50\" height=\"20\"><div name=\"divOne\" id=\"divOne\" style=\"position:relative;top:0px;left:0px;clip:rect(0,50,20,0);background-color:#ffffff;layer-background-color:#ffffff;\">one</div></td>
</tr>
<tr>
    <td id=\"Two\" width=\"50\" height=\"20\"><div name=\"divTwo\" id=\"divTwo\" style=\"position:relative;top:0px;left:0px;clip:rect(0,50,20,0);background-color:#ffffff;layer-background-color:#ffffff;\">two</div></td>
</tr>
</table><br>
<a href=\"java script:void(changeColor(\'One\', \'#FF0000\'));\">Farg celle \'one\' rød</a><br>
<a href=\"java script:void(changeColor(\'One\', \'#00FF00\'));\">Farg celle \'one\' grønn</a><br>
<a href=\"java script:void(changeColor(\'Two\', \'#FF0000\'));\">Farg celle \'two\' rød</a><br>
<a href=\"java script:void(changeColor(\'Two\', \'#00FF00\'));\">Farg celle \'two\' grønn</a><br>

</body>
</html>

/nute

nute (kl. 12:31:45)>> OK, det så jeg ikke lige...
olebole (kl. 12:39:46)>>Man kan vel godt sige:
<td bgColor=\"#000000\">
??? :-)

phoenixv >> Det der er HTML og ikke det, vi taler om. Vi taler om at sætte CSS dynamisk via JavaScript.
Ja, det kan man selvfølgelig godt  :)
/mvh

Det må jeg sige nute!!

Lige i øjet, og på mindre end 24 timer....TAK!

Oxo tak til jer andre som har bidraget til at denne løsning blev optimal!

jammen, det var da bare hyggelig :)