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 7 of 7
  1. #1
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post

    inverse of hex value

    I have created a spreadsheet system using js/php. The user has the ability to change the background color of a cell. Now I wish for the text color in the cell to be the inverse of the hex value which is set as the background.

    Currently I just convert the hex to bin, flip the bits and then go back to hex. But if the value is 000000 or 0* or *0 I lose the 0s. I was thinking perhaps I could pad the value with a 1 at either end and remove it later, unless there is a way to stop js trimming off these values.
    Omnis mico antequam dominus Spookster!

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Try modify your script to return strings instead of numbers when converting back in hexa. Anyway you will use the hexa result as a string in your javascript code.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    How do I go about doing that? I'm not exactly a js guru, I only ever declare variables as var.
    Omnis mico antequam dominus Spookster!

  • #4
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    well... firts at all I don't think you put the problem in an appropiate manner. The "opposite" color, as you said must be treated, I guess, in a RGB manner, which means you don't need to converty bunary, but decimal.

    Assuming that you have the hexa color

    #00CCFF
    that means you must split that in 3 and convert to decimal

    00 Hex = 0; Red
    CC Hex = 204; Green
    FF Hex = 255; Blue

    parseInt(hex,16) will do that job

    Now the "opposite" color could be the difference between 255 and the correspondend RGB value

    255-0 = 255 = FF Hex ; Red
    255-204 = 51 = 33 Hex; Green
    255-255 = 0 = 00 Hex; Blue

    to convert in hexa you need a function

    In fact you don't need to convert it back to hexa, but use them as well in you CSS on-the-fly code

    object.style.color='rgb(255,51,0)';

    That means
    #FF3300

    In conclusion I think you must split in 3, convert each in decimal, substract each from 255, and if you want hexa by all means, convert each back in hexa, reasamble and adding # to the result string. It would not be very difficult, can you manage it by yourself?
    Last edited by Kor; 11-11-2004 at 11:17 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    I just realize that....By the way... Why not using RGB CSS from the begining, and save al lot of unecessary converting problems?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <
    html>
    <
    head>
    <
    title>Untitled Document</title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    meta http-equiv="Content-Style-Type" content="text/css">
    <
    meta http-equiv="Content-Script-Type" content="text/javascript">
    <
    script language="JavaScript" type="text/JavaScript">
    function 
    bla(){
    var 
    document.getElementsByTagName('body')[0];
    var 
    bg b.style.backgroundColor;
    alert('the present background is '+b.style.backgroundColor)
    alert('the present background will be change into inversed RGB color')
    var 
    oldCol bg.split('(')[1].split(')')[0].split(',');
    var 
    newCol = new Array()
    for(var 
    i=0;i<oldCol.length;i++){
    newCol[i] = 255-Number(oldCol[i]);
    }
    b.style.backgroundColor 'rgb('+newCol[0]+','+newCol[1]+','+newCol[2]+')';
    alert('the new background is '+b.style.backgroundColor)
    }
    onload=bla
    </script>

    </head>
    <body style="background-color: rgb(0,204,255)">
    </body>
    </html> 
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    Actually, I don't know why I didn't go that direction. I guess I didn't really think about it, I just said to myself- need to invert the color, just invert the binary representation, that's easy enough. I mean, converting base to base is not exactly complex.

    Thanks very much for your help (and I actually figured out the string bit) ..
    Omnis mico antequam dominus Spookster!


  •  

    Posting Permissions

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