topical media & game development

talk show tell print

graphic-javascript-effect-background-random-effect.htm / htm



  
  <!-- TWO STEPS TO INSTALL RANDOM BACKGROUND:
  
    1.  Copy the coding into the HEAD of your HTML document
    2.  Add the last code into the BODY of your HTML document  -->
  
  <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  
  <HEAD>
  
  <SCRIPT LANGUAGE="JavaScript">
  
  <!-- This script and many more are available free online at -->
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Begin
  function changeBgcolor() {
  document.bgColor = document.colorChange.text.value
  document.colorChange.colorValue.value = ""
  }
  function randomBg() {
  var hex1=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var hex2=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var hex3=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var hex4=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var hex5=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var hex6=new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F")
  var bg="#"+hex1[Math.floor(Math.random()*hex1.length)]+hex2[Math.floor(Math.random()*hex2.length)]+hex3[Math.floor(Math.random()*hex3.length)]+hex4[Math.floor(Math.random()*hex4.length)]+hex5[Math.floor(Math.random()*hex5.length)]+hex6[Math.floor(Math.random()*hex6.length)]
  document.bgColor = bg
  document.colorChange.colorValue.value = bg
  document.colorChange.text.value = ""
  }
  function timedChange() {
  millisecs = document.colorChange.millisec
  hexchanger = setInterval("randomBg()", millisecs.value)
  }
  function timedChangestop() {
  clearInterval(hexchanger)
  }
  //  End -->
  </script>
  
  </HEAD>
  
  <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  
  <BODY>
  
  <center>
  Type a color name or a hexadecimal value into the first textbox
   and click "Change Background" to view it as the background
   color. Click "Random Background" to view a random color and
   see its hex value in the textbox below. "Change Constantly" wil
  l make a new, random background color at the defined interval,
   and "Stop!" will stop the interval. [Do not click "Change
   Constantly" more than once without clicking "Stop!" first or the
   script will be uncontrollable.] None of the background colors are
   predefined, they are selected randomly.
  <br>
  <form name="colorChange">
  <input type="text" size=20 name="text">    
  <input type="button" value="Change Background" onClick="changeBgcolor()">
  <br><br>
  <input type="button" value="Random Background" onClick="randomBg()">
  <br><br>
  <b>Current Random Background</b>
  <br>
  <input type="text" name="colorValue" size=10>
  <br><br>
  <input type="button" value="Change Constantly" onClick="timedChange()">
  <br>
  Rate of Change in Milliseconds:   <input type="text" name="millisec" size=5>
  <br><br>
  <input type="button" value="Stop!" onClick="timedChangestop()">
  </form>
  </center>
  
  <p><center>
  <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  </center><p>
  
  <!-- Script Size:  3.20 KB -->
  


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.