Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Jun 2011
    Location
    Algeirs,Algeria
    Posts
    43
    Thanks
    5
    Thanked 3 Times in 3 Posts

    Macintosh Random Color Changer library script

    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.
    Attached Files Attached Files

  • #2
    New Coder
    Join Date
    Jun 2011
    Location
    Algeirs,Algeria
    Posts
    43
    Thanks
    5
    Thanked 3 Times in 3 Posts

    Thumbs up Random Color Changer - bookmarklet version!

    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>
    Last edited by Hamza7; 06-19-2011 at 09:56 PM.

  • #3
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,461
    Thanks
    1
    Thanked 23 Times in 21 Posts
    Methinks you might benefit from learning about Number.toString(base).
    "The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
    June 30, 2001
    author, Verbosio prototype XML Editor
    author, JavaScript Developer's Dictionary
    https://alexvincent.us/blog

  • #4
    New Coder
    Join Date
    Jun 2011
    Location
    Algeirs,Algeria
    Posts
    43
    Thanks
    5
    Thanked 3 Times in 3 Posts
    Quote Originally Posted by Alex Vincent View Post
    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.
    ----------------------------------------------------------------------------------------------------------
    Sorry I think that the attachments are not visible I don't know why, alternatively you can download from here http://www.filesonic.com/folder/6978321
    Last edited by Hamza7; 06-20-2011 at 07:03 PM.

  • #5
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    946
    Thanks
    0
    Thanked 129 Times in 128 Posts
    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>

  • #6
    New Coder
    Join Date
    Jun 2011
    Location
    Algeirs,Algeria
    Posts
    43
    Thanks
    5
    Thanked 3 Times in 3 Posts
    Quote Originally Posted by lerura View Post
    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>

  • #7
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,461
    Thanks
    1
    Thanked 23 Times in 21 Posts
    I guarantee you, you don't need that Digits array.
    "The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
    June 30, 2001
    author, Verbosio prototype XML Editor
    author, JavaScript Developer's Dictionary
    https://alexvincent.us/blog

  • #8
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    946
    Thanks
    0
    Thanked 129 Times in 128 Posts
    Quote Originally Posted by Alex Vincent View Post
    I guarantee you, you don't need that Digits array.
    Explain!

  • #9
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,461
    Thanks
    1
    Thanked 23 Times in 21 Posts

    Lightbulb

    Well, as I said earlier, Number.prototype.toString(16) can save you some trouble.

    For instance, if I type (14).toString(16) into my JavaScript console, I get back "e". Your line:

    Code:
    hexColor+=Digits[Math.floor(Math.random()*16)];
    could simply be rewritten as:

    Code:
    hexColor += Math.floor(Math.random()*16).toString(16)
    For that matter, you could simply say:
    Code:
    var hexColor = "#" + Math.floor(Math.random() * Math.pow(16, 6)).toString(16);
    and be done with it.
    Last edited by Alex Vincent; 06-22-2011 at 06:56 AM. Reason: typo
    "The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
    June 30, 2001
    author, Verbosio prototype XML Editor
    author, JavaScript Developer's Dictionary
    https://alexvincent.us/blog


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •