Opened 9 years ago

Closed 7 years ago

#5393 closed bug (fixed)

getColor reports inaccurate color for transparent elements in Webkit

Reported by: Rwhitbeck Owned by: Corey Frang
Priority: major Milestone: 1.9.0
Component: ui.effects.core Version: 1.8
Keywords: color Cc:
Blocked by: Blocking:


I realize that getColor (from jquery.effects.core.js) is not an exposed function, but I did notice something odd about the logic which leads to it reporting incorrectly for transparent elements on Webkit. I copied getColor, getRGB and the 'colors' variable out into a simple example file with the latest jQuery and following contents:

Copy code

  1. <div id="red" style="background-color:red;">
  2. <div id="trans">
  3. Some text.
  4. </div>
  5. </div>

And with the following call:

Copy code

  1. alert(getColor($('#trans').get(0),'backgroundColor'));

Webkit (Chrome) will alert 255,255,255 while Firefox will alert 255,0,0

This is because there are two places in the code that handle transparency. Firefox (and I assume IE) transparency is caught in the do/while loop in getColor while Webkit transparency falls through to getRGB and is caught with a regular expression, thus returning colorstransparent?, which happens to be white.

Shouldn't getColor also handle the Webkit transparency something like this:

Copy code

if ( color != && color != 'transparent' && color != 'rgba(0, 0, 0, 0)'
$.nodeName(elem, "body") )

I saw mention of exposing getColor publicly and figured that this might be worth addressing before it's up for general use.

I've put together a working example of the issue and a copy of the getColor function with the logic moved so that it reports accurately for Webkit.


Change History (8)

comment:1 Changed 9 years ago by Jörn Zaefferer

Component: ui.coreeffects.core

comment:2 Changed 8 years ago by aidan

There seems to be a fix for this suggested in

comment:3 Changed 8 years ago by Scott González

#6823 is a duplicate of this ticket.

comment:4 Changed 8 years ago by Corey Frang

Status: newopen

comment:5 Changed 8 years ago by Corey Frang

Owner: set to Corey Frang
Status: openassigned

comment:6 Changed 8 years ago by Corey Frang

I'm going to be handling this in jQuery-color -- The expected return from should be "transparent"

comment:7 Changed 8 years ago by Corey Frang

Keywords: color added

comment:8 Changed 7 years ago by Scott González

Resolution: fixed
Status: assignedclosed

Upgrade to jquery-color 2.0pre. Fixes #6910 - Trying to animate the background color of a document fragment can easily fail. Fixes #5215 - Effects color: Add support for rgba animations. Fixes #4372 - Animate backgroundColor to 'transparent'. Fixes #5393 - getColor reports inaccurate color for transparent elements in Webkit. Fixes #3806 - Feature request: expose getRGB and getColor.

Changeset: 13d560b8f05a8eedbf28851824fe639a254f9fd0

Note: See TracTickets for help on using tickets.