Closed Thread Icon

Topic awaiting preservation: style.backgroundColor problemo (Page 1 of 1) Pages that link to <a href="" title="Pages that link to Topic awaiting preservation: style.backgroundColor problemo (Page 1 of 1)" rel="nofollow" >Topic awaiting preservation: style.backgroundColor problemo <span class="small">(Page 1 of 1)</span>\

Obsessive-Compulsive (I) Inmate

From: Sweden
Insane since: Jan 2005

posted posted 03-08-2006 16:24


Im trying to accomplish this JS were the background color of an element fades..

to do this I made a script that takes the current style.backgroundColor splits it up
into 6 one char variables and cuts the "#" of and changes the value of this 6 variables
according to the indexOf(var)+1 of a string that look like this:
"0123456789ABCDEF" and then pack them together to a 6 digit hex string..
and then setTimeout() until all 6 variables is == "f"

The problem seems to be that either way I set the style.backgroundColor value
In Firefox (Mozilla) it becomes a rgb value "rgb(*,*,*)"
is there a way to get the hex value - or will I have to make browser specific scripts?

I hope I make sense..


Maniac (V) Inmate

Insane since: Jul 2005

posted posted 03-08-2006 16:26

No, you don't.

Maniac (V) Inmate

Insane since: Jul 2005

posted posted 03-08-2006 16:32

More seriously, you won't reach your goal this way. You won't have a correct fader if you just "push the digits up"
from an hex representation (you'll skip some).

And, you're better off using style.background with rgb components anyway.
Better compatibility, easier to use (numbers instead of hex), a cleaner code, and other benefits.

My 2 cents.

Paranoid (IV) Inmate

From: Norway
Insane since: Jun 2002

posted posted 03-08-2006 17:16

First of all I hope you realize that the hex code of a color represents 3 bytes ( RrGgBb ), so if you want a smooth fade you have to increase each byte, and not each 'hex digit'.

Just so you know JavaScript handles base conversions. To go from hex to dec just do : decValue = parseInt( hexValue, 16 ); and to go from dec to hex do : hexValue = decValue.toString( 16 );

Being a bit oldschool I personnaly prefer to use hex code of colors, and manipulate them with bitwise operations.

When converting from dec to hex, to create an hex color code, make sure that the hex representation of each component takes 2 'hex digits'. To do that I usually do : ('0'+decValue.toString( 16 ) ).substr( -2 );

Hope that helps,

(Edited by poi on 03-08-2006 17:29)

Obsessive-Compulsive (I) Inmate

Insane since: Feb 2006

posted posted 03-18-2006 03:26

I think if you use the old bgcolor attribute instead of styles, Firefox will return a hex code if it was written as such. If you're really interested, try viewing this page in various browsers to see how JavaScript interprets the colors.

(Edited by BuilderQ on 03-18-2006 05:22)

Maniac (V) Mad Scientist

From: :morF
Insane since: May 2000

posted posted 03-18-2006 06:56

If you really feel like digging through source code to find out how one person (or group) has done thing, go to because part of the new release of WordPress is a box that fades from yellow to blue upon configuration changes and page adding/edits.

Justice 4 Pat Richard

« BackwardsOnwards »

Show Forum Drop Down Menu