Farbwechsler
ratlos
- javascript
Hallo,
aus diesem Quellcode soll ein Farbwechsler entstehen der alle Farbe durchläuft mittels einer for->Schleife. Was genau muss im Code verändern.
<html>
<head>
<title>Farbwechsler</title>
<Body BGColor=#FFFFFF"<P>
<script Language="JavaScript">
function anzeigen()
for (i=1;i<=16777216;i++)
{
document.bgColor=#+i;
for(j=1;j<=2000000;j++)
{} //Warteschleife
}//Farbenausgeben
</script>
</head>
<body onload=anzeigen>
</body>
Grüße und Vielen Dank
</html>
Lieber ratlos,
was an diesem Code verstehst Du (schon), und was (noch) nicht?
Für mich sieht Dein Posting so aus, als hättest Du Dir wild irgendein Script zusammenkopiert, darin etwas geändert, festgestellt, dass es nicht so funzt wie Du das wolltest, und willst nun, dass Dir hier jemand das Teil "repariert".
Liebe Grüße,
Felix Riesterer.
Hallo,
aus diesem Quellcode soll ein Farbwechsler entstehen der alle Farbe durchläuft
alle Farben? Kreuz und quer durch den ganzen RGB-Farbraum?
Was genau muss im Code verändern.
Nahezu alles.
<html>
<head>
DOCTYPE fehlt.
<title>Farbwechsler</title>
<Body BGColor=#FFFFFF"<P>
Möchtest du nicht erst das head-Element schließen? Das schließende Tag ist in HTML zwar optional, schön ist das aber nicht, und du schießt dir ja auch treffend selbst ins Knie (siehe unten).
Element- und Attributnamen werden normalerweise klein geschrieben; Angaben zur Darstellung gehören ins Stylesheet, nicht in missbilligte HTML-Attribute; Tag-Klammern und Anführungszeichen sollten paarig auftreten.
<script Language="JavaScript">
Das type-Attribut fehlt; language gehört dafür in die große virtuelle Tonne.
function anzeigen()
for (i=1;i<=16777216;i++)
Warum lässt du den Wert 0 weg, und nimmst dafür einen Wert jenseits des zulässigen Bereichs mit?
document.bgColor=#+i;
Was soll das für eine lustige Operation sein?
for(j=1;j<=2000000;j++)
{} //Warteschleife
Das möchtest du ganz sicher nicht; eher schon ein setTimeout() oder setInterval().
Deine "endlose" Schleife wird je nach Rechner und Browser eine sehr lange Zeit laufen, und in der Zeit ist der Browser nicht bedienbar. Üblicherweise schlägt aber nach einigen Sekunden ein Timeout zu, der dem Anwender anbietet, das nicht mehr reagierende Script zu beenden.
</script>
</head>
Huch? Du hattest doch schon längst das body-Element geöffnet, head damit implizit geschlossen. Jetzt nochmal?
<body onload=anzeigen>
Wenn man einen Eventhandler direkt im Javascript setzt, weist man ihm eine Funktionsreferenz zu, das würde etwa so aussehen. Aber wenn man ihn als HTML-Attribut festlegt, notiert man einen String, der gültigen (und sinnvollen) Javascript-Code enthält.
So long,
Martin
Hi,
for(j=1;j<=2000000;j++) {} //Warteschleife
Das möchtest du ganz sicher nicht; eher schon ein setTimeout() oder setInterval().
Deine "endlose" Schleife wird je nach Rechner und Browser eine sehr lange Zeit laufen, und in der Zeit ist der Browser nicht bedienbar.
Und er findet noch nicht mal Zeit, um die Änderung der Hintergrundfarbe auch umzusetzen, er muß sich ja im Kreis drehen ...
cu,
Andreas
Hi,
aus diesem Quellcode soll ein Farbwechsler entstehen der alle Farbe durchläuft mittels einer for->Schleife. Was genau muss im Code verändern.
document.bgColor=#+i;
Um dein Kernproblem zu lösen:
Farben werden in HTML und CSS in der Regel als RGB angegeben (siehe etwa <http://de.selfhtml.org/css/formate/wertzuweisung.htm#farben@title=SELFHTML: Farben>.
Die einfachste Variante, um einen solchen Farbwechsler zu realisieren:
Schreibe drei ineinander verschachtelte Schleifen, jeweils eine für den R, G und B-Wert.
Die Schleifen laufen jeweils von 0 bis 255.
Dann kannst du den zusammengerechneten RGB-Wert dem Body zuschlagen.
Beispielcode:
var body = document.getElementsByTagName('body')[0];
for (var r = 0; r < 256; ++r) {
for (var g = 0; g < 256; ++g) {
for (var b = 0; b < 256; ++b) {
body.style.background-color = 'rgb(' + r + ',' + g + ',' + b + ')';
}
}
}
Bis die Tage,
Matti
Hallo,
body.style.background-color = 'rgb(' + r + ',' + g + ',' + b + ')';
auaaa! ;-)
Ciao,
Martin
Hi,
body.style.background-color = 'rgb(' + r + ',' + g + ',' + b + ')';
auaaa! ;-)
erm ja. Jetzt, wo du mich drauf hinweist :)
Habe die letzte halbe Stunde mit jQuery gearbeitet und mich schon beim Schreiben drüber geärgert, dass ich so umständliches Zeugs schreiben muss.
Hätte vielleicht doch mal testen sollen. Aber steht ja "Beispielcode" drüber.
Bis die Tage,
Matti
Lieber Matti,
anstelle der drei verschachtelten Schleifen hat mir die eine einzige Schleife mit den über 16Mio Farben besser gefallen. Ehrlich!
Aber auch Du hast vergessen, dass der Browser die Farbwerte (von dem Syntax-Fehler mit "background-color
" einmal abgesehen) niemals zuweisen wird, da er mit der Abarbeitung des Codes wesentlich mehr beschäftigt ist. Dazu braucht es wie schon erwähnt Timeouts, damit der Browser auch einmal die Luft hat, die gewünschten Änderungen am DOM auch visuell umzusetzen!
Liebe Grüße,
Felix Riesterer.
Hi,
anstelle der drei verschachtelten Schleifen hat mir die eine einzige Schleife mit den über 16Mio Farben besser gefallen. Ehrlich!
Nicht immer ist die schönste Lösung auch diejenige, die am leichtesten verständlich ist. Natürlich reicht es, in einer Schleife die Zählvariable einfach nach Hex zu kodieren.
Aber dabei wird dann schon vorausgesetzt, dass der OP mit Farbwerten umgehen kann, dass er weiß, was die Angaben bedeuten und dass er es deswegen ignorieren kann, weil die Farb-Tripel zufälligerweise alle einer Hex-Zahl entsprechen.
Hingegen braucht man das Wissen um die Eineindeutigkeit der Hex-Angabe nicht, wenn man einfach den Farbwert als RGB zuweist. Und da halte ich drei getrennte Farbwerte (und Zähler) für leichter verständlich.
Aber auch Du hast vergessen, dass der Browser die Farbwerte (von dem Syntax-Fehler mit "
background-color
" einmal abgesehen) niemals zuweisen wird, da er mit der Abarbeitung des Codes wesentlich mehr beschäftigt ist. Dazu braucht es wie schon erwähnt Timeouts, damit der Browser auch einmal die Luft hat, die gewünschten Änderungen am DOM auch visuell umzusetzen!
Ich lehne mich mal aus dem Fenster und sage: dies war nicht teil der Aufgabenstellung. Ich will ja auch keinen fertigen Code abliefern, sondern prinzipielle Möglichkeiten demonstrieren.
Und Syntax-Fehler passieren halt, wenn man Code nicht testet und pures JS ohne Framework kaum mehr gewöhnt ist :-) Da hat der OP wenigstens was zum Suchen.
Bis die Tage,
Matti