topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

talk show tell print

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



  
  <!-- TWO STEPS TO INSTALL ROULETTE:
  
     1.  Paste designated code into HEAD of your HTML document
     2.  Add the second script to the BODY of your HTML document  -->
              
  <!-- STEP ONE:  Paste this code into HEAD of your document  -->
   
  <HEAD>
  
  <SCRIPT LANGUAGE="JavaScript">
  
  <!-- Original:  Michael Tartaglia (stonedstan@hotmail.com) -->
  <!-- Web Site:  http://www.geocities.com/SiliconValley/Horizon/5235 -->
  
  <!-- This script and many more are available free online at -->
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Begin
  color=new Array("0","8","F");
  speed=250;
  document.bgColor="FFFFFF";
  bg=new Array("FFFFFF","FFFFFF","FFFFFF");
  function begin() {
  document.form.col1.value=" X "; document.form.col2.value=" X ";
  document.form.col3.value=" X "; i=0; roll(speed);
  }
  function roll(speedB) {
  if (document.form.col1.value==" X ") {
  document.form.c1.value=document.form.b1.value;
  document.form.b1.value=document.form.a1.value;
  document.form.a1.value=
  color[Math.round(Math.random()*10)%3]+
  color[Math.round(Math.random()*10)%3];
  }
  if (document.form.col2.value==" X ") {
  document.form.c2.value=document.form.b2.value;
  document.form.b2.value=document.form.a2.value;
  document.form.a2.value=
  color[Math.round(Math.random()*10)%3]+
  color[Math.round(Math.random()*10)%3];
  }
  if (document.form.col3.value==" X ") {
  document.form.c3.value=document.form.b3.value;
  document.form.b3.value=document.form.a3.value;
  document.form.a3.value=
  color[Math.round(Math.random()*10)%3]+
  color[Math.round(Math.random()*10)%3];
  }
  setTimeout("roll("+speedB+")",speedB);
  }
  function stop(col) {
  if (col==1) {document.form.col1.value="   ";i++;}
  if (col==2) {document.form.col2.value="   ";i++;}
  if (col==3) {document.form.col3.value="   ";i++;}
  if (i==3) {
  bg[0]=document.form.a1.value+
  document.form.a2.value+
  document.form.a3.value;
  bg[1]=document.form.b1.value+
  document.form.b2.value+
  document.form.b3.value;
  bg[2]=document.form.c1.value+
  document.form.c2.value+
  document.form.c3.value;
  speedB=500000;roll(speedB);
     }
  }
  function view(letter) {
  document.bgColor=bg[letter];
  document.form.color.value="#"+bg[letter];
  }
  // End -->
  </script>
  </head>
  
  <!-- STEP TWO:  Add this form to the body of the HTML document  -->
  
  <center>
  <form name="form">
  <table cellpadding=2>
  <tr><td align=center>
  <input type=text name="a1" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="a2" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="a3" size=2 onFocus="this.blur()" value=" ">
  <input type=button onClick="view(0)" value="View"><br>
  <input type=text name="b1" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="b2" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="b3" size=2 onFocus="this.blur()" value=" ">
  <input type=button onClick="view(1)" value="View"><br>
  <input type=text name="c1" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="c2" size=2 onFocus="this.blur()" value=" ">
  <input type=text name="c3" size=2 onFocus="this.blur()" value=" ">
  <input type=button onClick="view(2)" value="View"><br>
  <input type=button onClick="stop(1)" value=" X " name="col1"> 
  <input type=button onClick="stop(2)" value=" X " name="col2"> 
  <input type=button onClick="stop(3)" value=" X " name="col3"> 
           </td>
  <td valign=middle align=center>
  <input type=button onClick="begin()" value="Spin!"><p>
  <table bgcolor=FFFFFF border=1 cellspacing=0>
  <tr><td align=center valign=middle>"X" stops each wheel.<p>
  BG Color = <input type=text size=7 value="#FFFFFF" name=color>
  </td></tr>
  </table>
  </td></tr>
  </table>
  </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.67 KB  -->
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

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