changing background image? Help?

G

Gequina

Something goes wrong in my script. I'm all new to it so i don't know
much yet.
I have a set of buttons. And when you click on either of them, the
background image will change. Only it's not working. It works when i
click on one, but then when i want to click on another, it's not
working.
What am i doing wrong?
thanks in advance



<html><head><title></title>

<script type="text/javascript">
var buttons="<img src=\"buttonrood2.jpg\"
onclick=\"print_waarde0()\"><img src=\"buttongroen2.jpg\"
onclick=\"print_waarde1()\"><img src=\"buttongeel2.jpg\"
onclick=\"print_waarde2()\"><img src=\"buttonblauw2.jpg\"
onclick=\"print_waarde3()\"><img src=\"buttonoranje2.jpg\"
onclick=\"print_waarde4()\"><img src=\"buttonmagenta2.jpg\"
onclick=\"print_waarde5()\"><img src=\"buttoncyaan2.jpg\"
onclick=\"print_waarde6()\">";



function print_waarde0() {
var a = "achtergrondrood.jpg";
var top = '<html><body background="' + a + '">';
var bottom = "</body></html>";
document.write(top+buttons+bottom);
}

function print_waarde1() {
var b = "achtergrondgroen.jpg";
var top1 = '<html><body background="' + b + '">';
var bottom1 = "</body></html>";
document.write(top1+buttons+bottom1);
}

function print_waarde2() {
var c = "achtergrondgeel.jpg";
var top2 = '<html><body background="' + c + '">';
var bottom2 = "</body></html>";
document.write(top2+buttons+bottom2);
}

function print_waarde3() {
var d = "achtergrondblauw.jpg";
var top3 = '<html><body background="' + d + '">';
var bottom3 = "</body></html>";
document.write(top3+buttons+bottom3);
}

function print_waarde4() {
var e = "achtergrondoranje.jpg";
var top4 = '<html><body background="' + e + '">';
var bottom4 = "</body></html>";
document.write(top4+buttons+bottom4);
}

function print_waarde5() {
var f = "achtergrondmagenta.jpg";
var top5= '<html><body background="' + f + '">';
var bottom5 = "</body></html>";
document.write(top5+buttons+bottom5);
}

function print_waarde6() {
var g = "achtergrondcyaan.jpg";
var top6 = '<html><body background="' + g + '">';
var bottom6 = "</body></html>";
document.write(top6+buttons+bottom6);




}

</script>

</head>
<body background="paeceachtergrond.jpg" bgproperties="fixed">
<h2>Welkom op Understanding Colors!</h2><br>
<font face="georgia">
Do you want to change the background?<br>
Choose from the following buttons and click on one.<br>

<body>

<img src="buttonrood2.jpg" onclick="print_waarde0()">
<img src="buttongroen2.jpg" onclick="print_waarde1()">
<img src="buttongeel2.jpg" onclick="print_waarde2()">
<img src="buttonblauw2.jpg" onclick="print_waarde3()">
<img src="buttonoranje2.jpg" onclick="print_waarde4()">
<img src="buttonmagenta2.jpg" onclick="print_waarde5()">
<img src="buttoncyaan2.jpg" onclick="print_waarde6()">

<br>
<br>

Op deze site kan je alles lezen over kleur en wat er mee te maken
heeft.<br>

</body>
</html>
 
E

Evertjan.

Gequina wrote on 21 okt 2004 in comp.lang.javascript:
Something goes wrong in my script. I'm all new to it so i don't know
much yet.
I have a set of buttons. And when you click on either of them, the
background image will change. Only it's not working. It works when i
click on one, but then when i want to click on another, it's not
working.
What am i doing wrong?
thanks in advance

Als je document.write gebruikt,
vernietig je de huidige pagina INCLUSIEF!!! aanwezige javascript.

Gebruik javascript en css:

<body>
Probeer dit eens:<br><br>
<button
onclick="document.body.style.backgroundColor='green'">
Groen</button>
<button
onclick="document.body.style.backgroundColor='red'">
Rood</button>
<button
onclick="document.body.style.backgroundColor='yellow'">
Geel</button>
</body>
 
R

Randy Webb

Gequina said:
Something goes wrong in my script. I'm all new to it so i don't know
much yet.
I have a set of buttons. And when you click on either of them, the
background image will change. Only it's not working. It works when i
click on one, but then when i want to click on another, it's not
working.
What am i doing wrong?
thanks in advance

function print_waarde0() {
var a = "achtergrondrood.jpg";
var top = '<html><body background="' + a + '">';
var bottom = "</body></html>";
document.write(top+buttons+bottom);
}

You are using document.write after the page has finished loading. That
removes the current page and replaces it with your new code. That means
your script is no longer present so it can't be run. Look at the FAQ and
its DynWrite function to modify a page.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq
Answer:It destroys the order of the conversation
Question: Why?
Answer: Top-Posting.
Question: Whats the most annoying thing on Usenet?
 
G

Gequina girl

ok, ergens begrijp ik het wel, maar niet helemaal. Ik ben echt nieuw
hierin, maar moet aankomende maandag wel een presentatie hierover houden
en t gaat lastiger dan dat ik dacht.
Ik snap nu niet wat ik weg moet halen en wat moet blijven staan. Kan je
me helemaal helpen met het hele script? sorry als ik lastig ben, het
hoeft niet.

moeten al deze vakjes weg?

function print_waarde0() {
var a = "achtergrondrood.jpg";
var top = '<html><body background="' + a + '">';
var bottom = "</body></html>";
document.write(top+buttons+bottom);
}

*zucht*...sorry, ik ben het helemaal kwijt nu.

en je zegt dat ik javascript+css moet doen. Maar hoe schrijf ik dat op?
< script type="text/javascript/css" > ???
of anders?

ok, wat ik nu in elkaar heb gefrabiceerd is dit:


<html><head><title></title>

<script type="text/javascript">
var buttons="<img src=\"buttonrood2.jpg\"
onclick=\"print_waarde0()\"><img src=\"buttongroen2.jpg\"
onclick=\"print_waarde1()\"><img src=\"buttongeel2.jpg\"
onclick=\"print_waarde2()\"><img src=\"buttonblauw2.jpg\"
onclick=\"print_waarde3()\"><img src=\"buttonoranje2.jpg\"
onclick=\"print_waarde4()\"><img src=\"buttonmagenta2.jpg\"
onclick=\"print_waarde5()\"><img src=\"buttoncyaan2.jpg\"
onclick=\"print_waarde6()\">";
</script>
</head>

<body background="paeceachtergrond.jpg" bgproperties="fixed">
<h2>Welkom op Understanding Colors!</h2><br>

<body>

<font face="georgia">
Wil je de achtergrond kleur veranderen?<br>
Kies dan uit 1 van de volgende buttons.<br>

<script type="text/javascript">
<button
onclick="document.body.style.backgroundImage='achtergrondrood.jpg'">
<img src="buttonrood2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondgroen.jpg'">
<img src="buttongroen2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondgeel.jpg'">
<img src="buttongeel2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondblauw.jpg'">
<img src="buttonblauw2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondoranje.jpg'">
<img src="buttonoranje2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondmagenta.jpg'">
<img src="buttonmagenta2.jpg"></button>
<button
onclick="document.body.style.backgroundImage='achtergrondcyaan.jpg'">
<img src="buttoncyaan2.jpg"></button>

</script>

<br>
<br>

Op deze site kan je alles lezen over kleur en wat er mee te maken
heeft.<br>

</body>
</html>

ik ben t echt helemaal kwijt, please help me? haha
alvast bedankt!
xxx
 
E

Evertjan.

Gequina girl wrote on 21 okt 2004 in comp.lang.javascript:
<script type="text/javascript">
<button
onclick="document.body.style.backgroundImage='achtergrondrood.jpg'">
<img src="buttonrood2.jpg"></button>

Heb je mijn code wel geprobeerd op zich zelf? Dat is werkende code,
hoor, zonder 1 toevoeging in een file test.html te zetten en te runnen
in de IE.

Dan zou je moeten zien dat <button> gewoon in HTML saat en niet in
<script type="text/javascript">
var buttons="<img src=\"buttonrood2.jpg\"
onclick=\"print_waarde0()\"><img src=\"buttongroen2.jpg\"
onclick=\"print_waarde1()\"><img src=\"buttongeel2.jpg\"
onclick=\"print_waarde2()\"><img src=\"buttonblauw2.jpg\"
onclick=\"print_waarde3()\"><img src=\"buttonoranje2.jpg\"
etc ....

Dat stuk heb je helemaal niet nodig.
Kan je me helemaal helpen met het hele script?

Nee, daar is een NG echt niet voor. Dan zou je iemand in moeten huren.
Ik ben echt nieuwhierin, maar moet aankomende maandag wel een
presentatie hierover houden en t gaat lastiger dan dat ik dacht.

Een presentatie moet je toch houden over iets wat je grondig begrijpt?
Je hebt toch nog heet hele weekend?

Gooi je oude code nu eens helemaal weg en begin met mijn eerste aanleg.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,479
Members
44,899
Latest member
RodneyMcAu

Latest Threads

Top