Javascript Bug (Hintergrundfarbe ändern)

[cartman]

hallo, ich habe eine frage,


und zwar habe ich radio buttons gemacht, mit denen man durch klicken die hintergrundfarbe der webseite ändern kann.


hier der code:
JS Bin - Collaborative JavaScript Debugging


nun ist es allerdings so, dass der hintergrund nicht mit der farbe komplett gefüllt wird (erst nach zb. scrollen, bekommt alles die farbe). aber seht selbst, die radio buttons befinden sich ganz unten.


weiß jemand woran das liegt und was ich ändern muss, damit onclick die gesamte seite mit der hintergrundfarbe gefüllt wird?


würde mich sehr freuen, lg und vielen dank schon mal.

 

[threadi]

Du hast keine Buttons in dem Sinn sondern radio-Buttons. Außerdem sind diese falsch definiert. Ein Link ist nicht notwendig, und "javascript" muss man nicht noch in onclick schreiben. Korrekt wäre:

<input class="radiobutton" type="radio" name="Color" value="0" onclick="changeBGC('#0000ff');">

Außerdem frage ich mich was Du genau erreichen willst? Wenn einer der 3 Radio-Buttons ausgewählt ist, soll sich die Hintergrundfarbe zu dem entsprechenden ändern? Dann müsstest Du nicht mit onclick sondern eher mit onchange arbeiten.

Die Hintergrundfarbe des Dokumentes würde ich zudem mit CSS angeben, also:

document.body.style.backgroundColor = color;

 

[cartman]

Außerdem frage ich mich was Du genau erreichen willst? Wenn einer der 3 Radio-Buttons ausgewählt ist, soll sich die Hintergrundfarbe zu dem entsprechenden ändern? Dann müsstest Du nicht mit onclick sondern eher mit onchange arbeiten.

Die Hintergrundfarbe des Dokumentes würde ich zudem mit CSS angeben, also:

document.body.style.backgroundColor = color;

Ja du hast es schon richtig verstanden. Jeder radio button, soll wenn er "checked" ist, die hintergrundfarbe für den gesamten body ändern (mit einer definierten farbe).

Ich habe die Änderungen mal gemacht, leider bleibt bei mir das Problem im prinzip erhalten
http://jsbin.com/urukaj/9/edit

Ich bin noch immer absoluter anfänger, verzeih mir also bitte falls ich vorschläge nicht korrekt umsetze.

Vielen Dank schon mal!

EDIT:

Ich habe das Problem auffindig gemacht, finde nun jedoch keine Lösung. Und zwar funktioniert das ganze super, wenn ich einen CSS Reset einfüge. Leider funktioniert es wiederum nicht mehr, wenn ich die anderen CSS Angaben die nach dem CSS Reset folgen, drin habe.

Hier der Link:
http://jsbin.com/urukaj/12/edit

Entnimmt man im CSS alles ab /* _______CSS_______ */ funktioniert es. Aber ich brauche ja die CSS angaben. Was kann man nun machen?

 

[threadi]

Bei mir funktioniert es unter beiden Links im Firefox perfekt - welchen Browser hast Du?

 

[cartman]

Bei mir funktioniert es unter beiden Links im Firefox perfekt - welchen Browser hast Du?

In Chrome. Habe gerade geschaut, in Safari geht es bei mir ebenfalls nicht.

 

[cartman]

bin nun etwas weiter.

ich weiß jetzt, dass der fehler durch die float-left angabe im .info der css kommt. das Problem bekomme ich im chrome und safari browser.

weiß jemand, wie man das lösen könnte?

hier noch mal der link: JS Bin - Collaborative JavaScript Debugging

danke schon mal!!!