CJay: Farbübergänge function/if

SELF-Forum

Farbübergänge function/if

CJay
– Informationen zu den Bewertungsregeln

Ich bin Neuling im Bereich Javascript und ich mache gerade sozusagen lerning by doing ;D

ich benötige nun hilfe bei einem code der Farbübergänge simulieren "soll"
dies ich mir so vorgestellt habe das nach ind nach ein bereich an farbe gesenkt wird und ein anderer erhöht kukt euch das mal an vllt kann mir jem sagen was falsch ist

<html>  
<head>

<script type="text/javascript">  
var r=0, g=255, b=255;  
function farbe(){  
function gelbsenken(){  
while(g>0){  
g=g-1;  
window.setTimeout(gelbsenken(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
function rotsteiger(){  
while(r<255){  
r=r+1;  
window.setTimeout(rotsteiger(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
function blausenken(){  
while(b>0){  
b=b-1;window.setTimeout(blausenken(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
function gelbsteiger(){  
while(g<255){  
g=g+1;window.setTimeout(gelbsteiger(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
function rotsenken(){  
while(r>0){  
r=r-1;window.setTimeout(rotsenken(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
function blausteiger(){  
while(b<255){  
b=b+1;window.setTimeout(blausteiger(),100);  
document.getElementById('test').value=r+":"+g+":"+b;}}  
if(r==0 && g==255 && b==255){gelbsenken();}  
if(r==0 && g==0 && b==255){rotsteiger();}  
if(r==255 && g==0 && b==255){blausenken();}  
if(r==255 && g==0 && b==0){gelbsteiger();}  
if(r==255 && g==255 && b==0){rotsenken();}  
if(r==0 && g==255 && b==0){blausteiger();}  
window.setTimeout(farbe(),1);}  
</script>

</head>  
<body>  
<input type="text" id="test"></input>  
<input type="button" onclick="farbe();" value="Los gehts"></input>  
</body>  
</head>
Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Farbübergänge function/if

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@CJay:

    nuqneH

    vllt kann mir jem sagen was falsch ist

    Du hast ein Kätzchen umgebracht.

    Qapla'

    --
    „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ (Antoine de Saint-Exupéry)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Farbübergänge function/if

      CJay
      – Informationen zu den Bewertungsregeln

      Ja ich weiß das es mit css auch geht aber ich will javascript lernen und mir ist dieses Beispiel eingefallen <.< xD
      Ich will nur wissen was ich falsch gemacht habe.

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

  2. Farbübergänge function/if

    Alexander (HH)
    – Informationen zu den Bewertungsregeln

    Moin Moin!

    Ich bin Neuling im Bereich Javascript und ich mache gerade sozusagen lerning by doing ;D

    ich benötige nun hilfe bei einem code der Farbübergänge simulieren "soll"
    dies ich mir so vorgestellt habe das nach ind nach ein bereich an farbe gesenkt wird und ein anderer erhöht kukt euch das mal an vllt kann mir jem sagen was falsch ist

    Was sagt die Error-Console des Browsers, den Du benutzt?

    Abgesehen davon solltest Du Dich mal mit CSS-Transitions befassen, das ist der moderne Weg, gestalterische Effekte wie Farbwechsel umzusetzen. Javascript mißbrauchte man im letzten Jahrhundert dafür. Gunnar Bittersmann hat dazu in letzter Zeit reichlich gepostet, bemüh' mal die Forumssuche.

    Alexander

    --
    Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so".
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  3. Farbübergänge function/if

    david
    +3 Informationen zu den Bewertungsregeln

    Guten Abend,

    lerning by doing

    ist in JavaScript eine noch schlechtere Idee als anderorts in der (Web-)Entwicklung. Nachhaltig schmerzfrei JavaScript schreiben wirst du allein "by doing" nicht lernen, was insbesondere der Fehlertoleranz der Sprache geschuldet ist. "Irgendwie" kriegt man jeden Quark hingebogen und steht beim nächsten Mal doch wieder vor verwandten Problemen. Lern lieber von Grund auf vernünftig.

    Einen Hinweis gibts aber noch heut Abend von mir gratis: Kannst du in deinem Beispielcode auf Anhieb irgendeine Struktur erkennen?

    var r=0, g=255, b=255;

    function farbe(){
    function gelbsenken(){
    while(g>0){
    g=g-1;
    window.setTimeout(gelbsenken(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    function rotsteiger(){
    while(r<255){
    r=r+1;
    window.setTimeout(rotsteiger(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    function blausenken(){
    while(b>0){
    b=b-1;window.setTimeout(blausenken(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    function gelbsteiger(){
    while(g<255){
    g=g+1;window.setTimeout(gelbsteiger(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    function rotsenken(){
    while(r>0){
    r=r-1;window.setTimeout(rotsenken(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    function blausteiger(){
    while(b<255){
    b=b+1;window.setTimeout(blausteiger(),100);
    document.getElementById('test').value=r+":"+g+":"+b;}}
    if(r==0 && g==255 && b==255){gelbsenken();}
    if(r==0 && g==0 && b==255){rotsteiger();}
    if(r==255 && g==0 && b==255){blausenken();}
    if(r==255 && g==0 && b==0){gelbsteiger();}
    if(r==255 && g==255 && b==0){rotsenken();}
    if(r==0 && g==255 && b==0){blausteiger();}
    window.setTimeout(farbe(),1);}

      
Ich nicht. Deshalb habe ich auch nur zwei Zeilen davon gelesen. Einrücken wäre ein guter Start, wenn du willst, dass andere Personen (oder auch nur dein übermorgiges Ich) deinen Code schmerzfrei lesen können.  
  
-david
    Beitrag melden
    +3
    Informationen zu den Bewertungsregeln

    1. Farbübergänge function/if

      Julianovic
      – Informationen zu den Bewertungsregeln

      Hallo,

      im Visual Studio Express geöffnet. Bearbeiten > Dokument formatieren = das Ergebnis. Aufwand ca. 30 Sekunden.

      var r = 0, g = 255, b = 255;  
function farbe() {  
    function gelbsenken() {  
        while (g > 0) {  
            g = g - 1;  
            window.setTimeout(gelbsenken(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    function rotsteiger() {  
        while (r < 255) {  
            r = r + 1;  
            window.setTimeout(rotsteiger(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    function blausenken() {  
        while (b > 0) {  
            b = b - 1; window.setTimeout(blausenken(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    function gelbsteiger() {  
        while (g < 255) {  
            g = g + 1; window.setTimeout(gelbsteiger(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    function rotsenken() {  
        while (r > 0) {  
            r = r - 1; window.setTimeout(rotsenken(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    function blausteiger() {  
        while (b < 255) {  
            b = b + 1; window.setTimeout(blausteiger(), 100);  
            document.getElementById('test').value = r + ':' + g + ':' + b;  
        }  
    }  
    if (r == 0 && g == 255 && b == 255) { gelbsenken(); }  
    if (r == 0 && g == 0 && b == 255) { rotsteiger(); }  
    if (r == 255 && g == 0 && b == 255) { blausenken(); }  
    if (r == 255 && g == 0 && b == 0) { gelbsteiger(); }  
    if (r == 255 && g == 255 && b == 0) { rotsenken(); }  
    if (r == 0 && g == 255 && b == 0) { blausteiger(); }  
    window.setTimeout(farbe(), 1);  
}
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

  4. Farbübergänge function/if

    gast_42
    +2 Informationen zu den Bewertungsregeln

    dies ich mir so vorgestellt habe das nach ind nach ein bereich an farbe gesenkt wird und ein anderer erhöht kukt euch das mal an vllt kann mir jem sagen was falsch ist

    Der Code ist so schlecht formatiert, dass das "kuken" eine Zumutung wäre.
    Außerdem solltest du erst einmal deine Vorstellungen genauer formulieren und ebenso das angeben, was stattdessen passiert bzw. was die Fehlerkonsole deines Browsers davon hält.

    Ansonsten kurz ein erster Eindruck:
    in setTimeout gehört kein Funktionsaufruf mit Klammer, wenn die Funktion tatsächlich zeitverzögert aufgerufen werden soll.

    Beitrag melden
    +2
    Informationen zu den Bewertungsregeln

  5. Farbübergänge function/if

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@CJay:

    nuqneH

    function gelbsenken(){
    while(g>0){
    g=g-1;

    BTW, im RGB-Farbraum steht G nicht für Gelb, sondern für Grün.

    Qapla'

    --
    „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ (Antoine de Saint-Exupéry)
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln