[javascript] onchange: verander kleur

[disjfa]

hoe deed je dat ook al weer?

code:

document.all(id).style.background-color = this.form.bodybackgroundcolor

maar dat wil nie, idee-en?

[r0bert]

code:

document.all['idtje'].style.background-color = this.style.background-color;

ik weet het ook niet, maar als ik logisch nadenk krijg ik dit er uit ..

[disjfa]

Op dinsdag 30 oktober 2001 22:20 schreef r0bert het volgende:

code:

document.all['idtje'].style.background-color = this.style.background-color;

ik weet het ook niet, maar als ik logisch nadenk krijg ik dit er uit ..

jaja, maar dat moet dus nie de background color zijn, dat moet uit t formuliertje komen

[Hangloozz]

ook een poging:

code:

document.all[id].style.background-color = this.form.value

en misschien dat je beter een input-value kan nemen dan de form-value:

code:

document.all[id].style.background-color = this.inputnaam.value

edit: foutje weggepoetst

[Verwijderd]

value moet dan wel #000000 oid zijn he.

[disjfa]

t kan dan toch ook gewoon black of blue of red zijn????

[RM-rf]

Op dinsdag 30 oktober 2001 22:56 schreef Hangloozz het volgende:

edit: foutje weggepoetst

..maar Hangloozz zijn poetsdoekje was vergeten er ook even netjes

code:

document.all[id].style.backgroundColor = this.inputnaam.value

van te maken

[disjfa]

Op dinsdag 30 oktober 2001 23:24 schreef RM-rf het volgende:

code:

document.all[id].style.backgroundColor = this.inputnaam.value

van te maken

wert nie

code:

<script>
    function changebackcolor(id){
    document.all[id].style.backgroundColor = this.bodybackgroundcolor.value
    //document.all(id).css.backgroundColor = this.form.bodybackgroundcolor.value
    }
</script>
<table class="main">
<form action="prefs2.asp" method="post">
<tr><td colspan="3" class="maintop">
De achtergrond:
</td></tr>
<tr><td>
achtergrondkleur
</td><td>
<select name="bodybackgroundcolor" onchange="changebackcolor('bodybgcolor')">
<%selectoption%>
</select>

</form>
</td><td class="body" id="bodybgcolor">voorbeeld</td>
</tr>
</table>

<%selectoption%> = de options (kleuren bij naam)

[Hangloozz]

oei, wassie toch fout?
M'n poetsdoek bleef even haken op dat punt maar omdat ik er even vanuit ging dat dat element wel klopte heb ik um losgetrokken, maar al met al was dus heel disjfa's code zo'n beetje fout.

Ik ga morgen ff naar de Blokker om een nieuw HTML-microvezelpoetsdoekie te halen

[Hangloozz]

mja, disjfa, je moet nog ff een tutje javascript doornemen

zo werkt ie voor de body achtergrondkleur:

code:

<script>
    function changebackcolor(){
    document.body.style.backgroundColor = document.blaat.box.value
    //document.all(id).css.backgroundColor = this.form.bodybackgroundcolor.value
    }
</script>
<table class="main">
<form action="prefs2.asp" method="post" name="blaat">
<tr><td colspan="3" class="maintop">
De achtergrond:
</td></tr>
<tr><td>
achtergrondkleur
</td><td id="cel">
<select name="box" onblur="changebackcolor()">
<option value="#22ccff">kleur</option>
</select>
</form>
</td><td class="body" id="bodybgcolor">voorbeeld</td>
</tr>
</table>

ff tweaken naar eigen smaak

[disjfa]

het is nie de bedoeling om de achtergrond kleur te veranderen, alleen een vakje als voorbeeld...

het is de bedoeling om de hele site een andere kleur te laten geven.... wat de gebruiker zelf wil (ff uitdaging)

maar ik heb t dus zo:

code:

<tr><td>blabla:</td><td>selectbox</td><td>voorbeeldkleur</td></tr>

en die voorbeeldkleur kan ik dan opslaan en later in mn <style> zetten dmv cookies.......

[Hangloozz]

zoiets dus:

code:

<script>
    function changebackcolor(){
    document.all["cel"].style.backgroundColor = document.blaat.box.value;

    //document.all(id).css.backgroundColor = this.form.bodybackgroundcolor.value
    }
</script>
<table class="main">
<form action="prefs2.asp" method="post" name="blaat">
<tr><td colspan="3" class="maintop">
De achtergrond:
</td></tr>
<tr><td>
achtergrondkleur
</td><td>
<select name="box" onchange="changebackcolor()">
<option value="#22ccff">kleur1</option>
<option value="#ffccff">kleur2</option>
</select>
</form>
</td><td class="body" id="cel">voorbeeld</td>
</tr>
</table>

let je trouwens op dat je ook daadwerkelijk 'option' gebruikt.
Want op de plaats van dit: <%selectoption%> alleen een kleur invullen werkt helaas niet

[disjfa]

Op woensdag 31 oktober 2001 00:06 schreef Hangloozz het volgende:
zoiets dus:

code:

<script>
    function changebackcolor(id){
    document.all[id].style.backgroundColor = document.blaat.box.value;

        }
</script>
<table class="main">
<form action="prefs2.asp" method="post" name="blaat">
<tr><td colspan="3" class="maintop">
De achtergrond:
</td></tr>
<tr><td>
achtergrondkleur
</td><td>
<select name="box" onchange="changebackcolor('cel')">
<option value="green">green</option>
<option value="black">black</option>
<option value="blue">blue</option>
</select>
</form>
</td><td class="body" id="cel">voorbeeld</td>
</tr>
</table>

zo moet ie zijn , hij moet natuurlijk ook wel dynamisch zijn

* disjfa post dit alleen zodat ie vanaaf het kan copypasten

[disjfa]

ow ja, wat als je er meer dan een select boxje op wil zetten die allemaal t zelfde doen alleen op andere rijen

nog niet zo dynamisch

[drm]

* drm trekt aan de bel en zegt:
dit is IE-only shit. Als je het nou een beetje beter aanpakt werkt het in NS6 en Mozilla en Opera ook nog

_{hint getElementByID}

[disjfa]

Op woensdag 31 oktober 2001 10:55 schreef drm het volgende:
* drm trekt aan de bel en zegt:
dit is IE-only shit. Als je het nou een beetje beter aanpakt werkt het in NS6 en Mozilla en Opera ook nog

_{hint getElementByID}

eerst ff dit weten, ns6 en opera komt eraan

* disjfa vind t niet erg om idee-en daarover te horen

[Pelle]

* Pelle post wel even iets wat disjfa op weg moet helpen

Dit is een scriptje dat de achtergrondkleur van een <td> onMouseOver aanpast. Sleutel jouw code er even omheen en voila: IE, NS6 & Opera-compatible.

code:

<script language="javascript" type="text/javascript">
<!--
    function changeBg(what,how) {
        if (document.getElementById) {
            what.style.backgroundColor = ((how == 0) ? "" : how);
        }
    }
//-->
</script>

<table>
    <tr>
      <td class="menucell" onMouseOver="changeBg(this,'#df6b00')" onMouseOut="changeBg(this,0)"><a href="blab.nu" class="menulink">schrale bende</a></td>
    </tr>
</table>

[disjfa]

Op woensdag 31 oktober 2001 12:00 schreef Pelle het volgende:
* Pelle post wel even iets wat disjfa op weg moet helpen

* disjfa moet maar wat vaker de code van pelle pikken

gratz

[disjfa]

ow, hij moet de value van de select hebben.....

dus ergens iets van how.value...

[RM-rf]

Op woensdag 31 oktober 2001 12:20 schreef disjfa het volgende:
ow, hij moet de value van de select hebben.....

dus ergens iets van how.value...

dan moet je eens opzoeken in het 'alles over javascript'-boek dat nu natuurlijk naast je ligt, hoe je precies de value van een select opvraagt.

als je het niet kunt vinden moet je achterin even selectedIndex opzoeken als propertie van select-elementen

[disjfa]

Op woensdag 31 oktober 2001 12:42 schreef RM-rf het volgende:
als je het niet kunt vinden moet je achterin even selectedIndex opzoeken als propertie van select-elementen

nou t lullige is dat ie idd al werkt, maar ik krijg m met geen mogenlijkheid aan de praat met pelle`s script

[Hangloozz]

schijten is fijn voor de ziel

da's allemaal leuk en aardig maar leer nou zelf eens je r**t af te vegen.
Of zoals RM-rf je al duidelijk probeer(de)(t) te maken:
ff concentreren en combineren.
Je hebt alles wat je nodig hebt.

[Pelle]

* Pelle :

Een element op een pagina benader je dus zo:

code:

pauper = document.getElementById('naamVanHetElement');

Nu kun je daarmee de styleproperties aanpassen:

code:

pauper.style.backgroundColor = "#ff0000";
// nu wordt de achtergrondkleur rood

En wil je nou dat die achtergrondkleur uit je select komt, dan moet je het hier dus even mee combineren:

code:

kleur = document.forms['naamVanJeForm'].elements['naamVanJeSelect'].options[document.forms['naamVanJeForm'].elements['naamVanJeSelect'].selectedIndex].value;

* Pelle vind dit wel weer genoeg info

[drm]

* Pelle vind dit wel weer genoeg info

* drm vindt dat * Pelle te goed is voor deze wereld

[disjfa]

Op woensdag 31 oktober 2001 14:45 schreef drm het volgende:

[..]

* drm vindt dat * Pelle te goed is voor deze wereld

* disjfa is blij dat ie nix af weet van dom... javascript ala, maar dom.....