kostenloser Webspace werbefrei: lima-city


Javascript - Wechsel der Hintergrundfarbe

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    dreana

    dreana hat kostenlosen Webspace.

    Hallo, ich habe tag/folgende aufgabe">folgende Aufgabe bekommen und habe keine Ahnung von Javascript so wirklich.
    Ich soll per Javascript bei Microsoft Frontpage einen wechsel des Hintergrunds von Rot auf Gelb in 100 Schritten machen und könnte ein wenig Hilfe gebrauchen. Wenn ihr wisst, wie das geht, bitte sagt es mir. Danke
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Hallo,
    ich habe keine Ahnung von Microsoft Frontpage, dafür aber genug von Javascript ;-)
    Das Skript habe ich auf meiner Festplatte gefunden:
    <script language="Javascript" type="text/javascript">
    <!--
    var rgb = new Array(255, 0, 0);
    var redPerStep   = 0,
        greenPerStep = 0,
        bluePerStep  = 0;
    var steps = 100;
    var time = 2000;
    
    function initFarbeWechseln(r, g, b) {
        redPerStep   = parseFloat(((rgb[0] >= r) ? rgb[0]-r : r-rgb[0]) / steps);
        greenPerStep = parseFloat(((rgb[1] >= g) ? rgb[1]-g : g-rgb[1]) / steps);
        bluePerStep  = parseFloat(((rgb[2] >= b) ? rgb[2]-b : b-rgb[2]) / steps);
    
        farbeWechseln(0);
    }
    
    function farbeWechseln(i) {
        rgb[0] += redPerStep;
        rgb[1] += greenPerStep;
        rgb[2] += bluePerStep;
        document.getElementById("container").style.backgroundColor = "rgb("+parseInt(rgb[0])+", "+parseInt(rgb[1])+", "+parseInt(rgb[2])+")";
        if (i < steps) {
            window.setTimeout("farbeWechseln("+(i+1)+")", time/steps);
        }
    }
    
    //-->
    </script>
    <a href="javascript:;" onclick="initFarbeWechseln(255, 255, 0)">Farbe wechseln!</a>
    <div id="container" style="background-color:rgb(255, 0, 0);width:250px;height:200px;"></div>

    Ist schon einige Zeit her - daher eventuell nicht mehr aktuell - aber es funktioniert noch wunderbar.
    Viel Spaß damit!
    Gruß,
    dex
  4. Autor dieses Themas

    dreana

    dreana hat kostenlosen Webspace.

    qap2 schrieb:
    Hallo,
    ich habe keine Ahnung von Microsoft Frontpage, dafür aber genug von Javascript ;-)
    Das Skript habe ich auf meiner Festplatte gefunden:
    <script language="Javascript" type="text/javascript">
    <!--
    var rgb = new Array(255, 0, 0);
    var redPerStep   = 0,
        greenPerStep = 0,
        bluePerStep  = 0;
    var steps = 100;
    var time = 2000;
    
    function initFarbeWechseln(r, g, b) {
        redPerStep   = parseFloat(((rgb[0] >= r) ? rgb[0]-r : r-rgb[0]) / steps);
        greenPerStep = parseFloat(((rgb[1] >= g) ? rgb[1]-g : g-rgb[1]) / steps);
        bluePerStep  = parseFloat(((rgb[2] >= b) ? rgb[2]-b : b-rgb[2]) / steps);
    
        farbeWechseln(0);
    }
    
    function farbeWechseln(i) {
        rgb[0] += redPerStep;
        rgb[1] += greenPerStep;
        rgb[2] += bluePerStep;
        document.getElementById("container").style.backgroundColor = "rgb("+parseInt(rgb[0])+", "+parseInt(rgb[1])+", "+parseInt(rgb[2])+")";
        if (i < steps) {
            window.setTimeout("farbeWechseln("+(i+1)+")", time/steps);
        }
    }
    
    //-->
    </script>
    <a href="javascript:;" onclick="initFarbeWechseln(255, 255, 0)">Farbe wechseln!</a>
    <div id="container" style="background-color:rgb(255, 0, 0);width:250px;height:200px;"></div>

    Ist schon einige Zeit her - daher eventuell nicht mehr aktuell - aber es funktioniert noch wunderbar.
    Viel Spaß damit!
    Gruß,
    dex


    Hallo, vielen Dank für deine Hilfe.
    Ich habe aber noch ein kleines problem.
    Der Farbwechsel wird in einem kleinen Feld vollzogen und nicht im kompletten hintergrund.
    Wie kann ich das machen, dass es der komplette Hintergrund ist?
  5. indem du das was in dem <div>-tag steht einfach in den <body>-tag reinschreibst.
    Dann wird das darauf angewendet.
  6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!