Farbreifen

Unser User sfan hat ein weiteres Javascript eingeschickt.

Dabei werden in einem Kästchen mit 100 x 100 Pixeln alle Farben in der RGB-Farbpalette kurz angezeigt. Am Anfang könnt ihr dabei festlegen, ob mit r (rot), g (grün) oder b (blau) angefangen wird.

Neben einem Pause-Button gibt es auch einen Button zum Ändern der Anzeige-Geschwindigkeit.

<!-- präsentiert von kostenlose-javascripts.de --> <script type='text/javascript'> <!-- var r = 0; var g = 0; var b = 0; var go = true; var p = 10; var eho = ''; function initFK() { document.write('<input type="button" value="Start" onclick="start()" name="pl" id="pl" />'); document.write('<input type="button" value="Pause" onclick="stop()" name="pa" id="pa" /><br />'); document.write('<input type="button" value="Tempo ändern" onclick="javascript:tempo()" /><br />'); document.write('<input type="text" name="posi" id="posi" value="#FFFFFF" /><br />'); document.write('<input type="text" readonly="readonly" id="red" name="red" value="Rot:255" /><br />'); document.write('<input type="text" readonly="readonly" id="green" name="green" value="Grün:255" /><br />'); document.write('<input type="text" readonly="readonly" id="blue" name="blue" value="Blau:255" />'); document.write('<div id="farbkreis" style="width: 100px; height: 100px;"></div>'); eho = prompt("Welcher Wert soll als erstes erhöht werden?(r oder b oder g)").toLowerCase(); if (eho != "r" && eho != "g" && eho != "b") { alert("Falsche Eingabe"); } else {start();} } function toHex(integer) { hexValues = new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"); hexDigit1 = Math.floor(integer / 16); hexDigit2 = (integer % 16); return hexValues[hexDigit1] + hexValues[hexDigit2]; } function tempo() { if (p == 10) { p = 1; } else {p = 10; } } function stop() { document.getElementById('pa').setAttribute("style","visibility: hidden; display: none"); document.getElementById('pl').setAttribute("style",""); clearTimeout(loopID); } function start() { document.getElementById('pl').setAttribute("style","visibility: hidden; display: none"); document.getElementById('pa').setAttribute("style",""); start_(); } function start_() { if (go) { if (eho == "b") { b+=p; if (b > 255) {g += p;b = 0; } if (g > 255) { r += p; g = 0; } if (r > 255) { r = 255; } } if (eho == "g") { g+=p; if (g > 255) { r += p; g = 0; } if (r > 255) { b += p; r = 0; } if (b > 255) { b = 255; } } if (eho == "r") { r+=p; if (r > 255) { b += p; r = 0; } if (b > 255) { g += p; b = 0; } if (g > 255) { g = 255; } } document.getElementById('farbkreis').style.backgroundColor = "#" + toHex(r) + toHex(g) + toHex(b); document.getElementById('posi').value = "#" + toHex(r) + toHex(g) + toHex(b); document.getElementById('red').value = "Rot: " + r + " (" + toHex(r) + ")"; document.getElementById('green').value = "Grün: " + g + " (" + toHex(g) + ")"; document.getElementById('blue').value = "Blau: " + b + " (" + toHex(b) + ")"; loopID = setTimeout("start()", 1); } } //--> </script> <br /> JavaScript von <a href="http://www.kostenlose-javascripts.de/javascripts/verschiedenes/farbreifen/" target="_blank">kostenlose-javascripts.de</a> <br /> <script type="text/javascript">initFK();</script> <!-- präsentiert von kostenlose-javascripts.de -->