backgroundColor and Firefox

Discussion in 'Javascript' started by RobG, Nov 3, 2004.

  1. RobG

    RobG Guest

    When I set the background colour of an element using
    tdRef.style.backgroundColor and then read it back, Firefox always
    gives rgb(r, g, b) regardless of whether I've used rgb(...) or #rrggbb
    to set it.

    If I use tdRef.bgColor to set/read the value, I always get #rrggbb
    regardless of whether I've used rgb(...) or #rrggbb.

    IE, on the other hand, when using style.backgroundColor reports back in
    whatever format was used (either rgb(...) or #rrggbb), but, like
    Firefox, always gives #rrggbb for the bgColor method.

    My question is which method is most consistent across various browsers?
    I want to use style.backgroundColor (since some browsers don't support
    bgColor, I guess it's a legacy from the ver 4 browser days). If I
    decide to use rgb(...), is it consistently supported by other browsers
    or do some report in #rrggbb regardless?

    A bit of play code follows...

    Cheers, Rob.

    <script type="text/javascript">
    function setColor(x) {
    x.style.backgroundColor='#003366';
    //x.style.backgroundColor='rgb(0, 51, 102)';
    alert(x.style.backgroundColor);
    }
    function setColor2(x) {
    x.bgColor='rgb(0, 51, 102)';
    alert(x.bgColor);
    }
    </script>
    <table border="1"><tr>
    <td width="20px" height="20px"
    onclick="setColor(this);"></td>
    </tr><tr>
    <td width="20px" height="20px"
    onclick="setColor2(this);"></td>
    </tr></table>
    RobG, Nov 3, 2004
    #1
    1. Advertising

  2. RobG wrote:

    > When I set the background colour of an element using
    > tdRef.style.backgroundColor and then read it back, Firefox always
    > gives rgb(r, g, b) regardless of whether I've used rgb(...) or #rrggbb
    > to set it.


    Confirmed.

    > If I use tdRef.bgColor to set/read the value, I always get #rrggbb
    > regardless of whether I've used rgb(...) or #rrggbb.


    You must not use "rgb(...)" on that property since it reflects an HTML
    attribute and not a CSS property. "rgb(...)" is allowed in CSS only.

    > IE, on the other hand, when using style.backgroundColor reports back in
    > whatever format was used (either rgb(...) or #rrggbb), but, like
    > Firefox, always gives #rrggbb for the bgColor method.
    >
    > My question is which method is most consistent across various browsers?


    <http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-88135431>
    <http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSS2Properties-backgroundColor>

    > I want to use style.backgroundColor (since some browsers don't support
    > bgColor, I guess it's a legacy from the ver 4 browser days).


    You are confusing browser version and DOM. The `bgColor' property is part
    of the W3C HTML DOM, *originating* from implementations in most-used
    browsers at the time, particularly, but not limited to, so-called "ver 4
    browsers" (I suppose you mean IE 4 and NS 4; note that e.g. IE 5+ is still
    only Mozilla/4.0 compatible). The `backgroundColor' property is part of
    the W3C Style/CSS DOM.

    > If I decide to use rgb(...), is it consistently supported by other
    > browsers or do some report in #rrggbb regardless?


    Writing: The HTML attribute property should support the "#rrggbb" syntax
    (and reject other values except color names), while the CSS property should
    support "#rrggbb", "#rgb", "rgb(...)" values and color names.

    Reading: The HTML attribute property should return only the "#rrggbb" value
    or a color name, while you have to check (e.g. using a regular expression)
    of what format the read value of the CSS property is. By chance, I have
    recently hacked on a method to convert "rgb(...)" to "#rrggbb" named
    rgb2HexCode() and contained in <http://pointedears.de/scripts/string.js>
    (use <http://pointedears.ml-webhosting.de/scripts/string.js> in case of a
    timeout of the former).

    Unfortunately, it does not work yet with Opera 7. And some optimizations
    and enhancements are yet to be done.


    HTH

    PointedEars

    P.S.: I could not reply via e-mail, please verify your sender address.
    Thomas 'PointedEars' Lahn, Dec 12, 2004
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. LeftHorn
    Replies:
    11
    Views:
    1,110
    Blinky the Shark
    Apr 1, 2006
  2. Cliff Cotterill

    DropDownList BackgroundColor not set

    Cliff Cotterill, Nov 15, 2007, in forum: ASP .Net
    Replies:
    10
    Views:
    763
    Juan T. Llibre
    Nov 16, 2007
  3. André
    Replies:
    4
    Views:
    456
    André
    Jun 19, 2008
  4. Philip

    default style.backgroundColor value

    Philip, Sep 19, 2003, in forum: Javascript
    Replies:
    1
    Views:
    112
  5. cosmic foo

    backgroundColor

    cosmic foo, Jul 24, 2005, in forum: Javascript
    Replies:
    13
    Views:
    213
    Richard Cornford
    Jul 25, 2005
Loading...

Share This Page