Random Color Changer library script

Member Posts : 16 Join date : 2011-03-09

I made my first JavaScript library "Random Color Changer", it include a single function called randomColor(element,colorType) , it accept 2 optional arguments, [element] is the HTML element which we apply the color on it, [colorType] is the selected type of color, I mean the font color or the background color, this argument can be only the string "color" or the string "backgroundColor". Example:
randomColor(document.body,'backgroundColor')
If you call this function without any arguments it returns the Hex value of the color as a string. Example: "#A532B9"
This library was tested on FireFox 4, Chrome 12, IE 9 and worked well.
The script RandomColorChanger.js can be found with example.html page in the zip file in attachment.

Member Posts : 16 Join date : 2011-03-09

I made this version of Random Color Changer that can be used as bookmarklet in your browser (at least in FireFox) that can change the background color of any page, simply put the code below in one HTML page then drag and drop the resulted link in the bookmarks bar (sorry, I can' post the link here because the forum link tool doesn't support javascript: protocol).
Here is the source code (not formated well)

Code:: <a href='javascript:
var x_1 = Math.floor(Math.random()*16);
var x_2 = Math.floor(Math.random()*16);
var x_3 = Math.floor(Math.random()*16);
var x_4 = Math.floor(Math.random()*16);
var x_5 = Math.floor(Math.random()*16);
var x_6 = Math.floor(Math.random()*16);
switch(x_1){
      case 10 :
      x1 = "A";
      break;
      case 11 :
      x1 = "B";
      break;
      case 12 :
      x1 = "C";
      break;
      case 13 :
      x1 = "D";
      break;
      case 14 :
      x1 = "E";
      break;
      case 15 :
      x1 = "F";
      break;
      default :
      x1 = x_1;}
switch(x_2){
      case 10 :
      x2 = "A";
      break;
      case 11 :
      x2 = "B";
      break;
      case 12 :
      x2 = "C";
      break;
      case 13 :
      x2 = "D";
      break;
      case 14 :
      x2 = "E";
      break;
      case 15 :
      x2 = "F";
      break;
      default :
      x2 = x_2;}
switch(x_3){
      case 10 :
      x3 = "A";
      break;
      case 11 :
      x3 = "B";
      break;
      case 12 :
      x3 = "C";
      break;
      case 13 :
      x3 = "D";
      break;
      case 14 :
      x3 = "E";
      break;
      case 15 :
      x3 = "F";
      break;
      default :
      x3 = x_3;}
switch(x_4){
      case 10 :
      x4 = "A";
      break;
      case 11 :
      x4 = "B";
      break;
      case 12 :
      x4 = "C";
      break;
      case 13 :
      x4 = "D";
      break;
      case 14 :
      x4 = "E";
      break;
      case 15 :
      x4 = "F";
      break;
      default :
      x4 = x_4;}
switch(x_5){
      case 10 :
      x5 = "A";
      break;
      case 11 :
      x5 = "B";
      break;
      case 12 :
      x5 = "C";
      break;
      case 13 :
      x5 = "D";
      break;
      case 14 :
      x5 = "E";
      break;
      case 15 :
      x5 = "F";
      break;
      default :
      x5 = x_5;}
switch(x_6){
      case 10 :
      x6 = "A";
      break;
      case 11 :
      x6 = "B";
      break;
      case 12 :
      x6 = "C";
      break;
      case 13 :
      x6 = "D";
      break;
      case 14 :
      x6 = "E";
      break;
      case 15 :
      x6 = "F";
      break;
      default :
      x6 = x_6;}var color = "#"+x1.toString()+x2.toString()+x3.toString()+x4.toString()+x5.toString()+x6.toString();document.body.style.backgroundColor=color;void color;'>Random background color</a>

Member Posts : 16 Join date : 2011-03-09

Methinks you might benefit from learning about Number.toString(base).

Member Posts : 16 Join date : 2011-03-09

Scars wrote:: Methinks you might benefit from learning about Number.toString(base).

You are right, I think that it will be easy if I used Number.toString(16) instead of writing big pieces of code using switch statement I will try to edit my script.

Member Posts : 12 Join date : 2011-04-17

There is no need for such huge and advanced script to create a color.
This makes the value:

Code:: <script>
Digits=['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
function RandomHexColor(){
var hexColor='#';
for (N=0;N<6;N++){
hexColor+=Digits[Math.floor(Math.random()*16)];
}
return hexColor;
}
</script>

and it can be applied by this:

Code:: <a href="javascript:document.body.style.backgroundColor=RandomHexColor();">Random Background Color</a>

Member Posts : 16 Join date : 2011-03-09

DreamsFade wrote:

There is no need for such huge and advanced script to create a color.
This makes the value:

Code:: <script>
Digits=['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
function RandomHexColor(){
var hexColor='#';
for (N=0;N<6;N++){
hexColor+=Digits[Math.floor(Math.random()*16)];
}
return hexColor;
}
</script>

and it can be applied by this:

Code:: <a href="javascript:document.body.style.backgroundColor=RandomHexColor();">Random Background Color</a>

:D

Member Posts : 16 Join date : 2011-03-09

I guarantee you, you don't need that Digits array.

» jPaq - A Fully Customizable Utilities Library
» Help with script
» what would you call this script?
» Return to a PHP script
» where to write a script

Random Color Changer library script

Random Color Changer library script

Similar topics

Similar topics