kostenloser Webspace werbefrei: lima-city

Javascript - Wechsel der Hintergrundfarbe

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   dreana

   dreana hat kostenlosen Webspace.

   11:17, 23.4.2010

   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. qap2

   

   qap2 hat kostenlosen Webspace.

   20:04, 23.4.2010

   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.

   9:00, 30.4.2010

   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. reimann

   

   reimann hat kostenlosen Webspace.

   9:04, 30.4.2010

   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?