Side navigation
#5145 closed bug (fixed)
Opened August 31, 2009 10:58AM UTC
Closed October 12, 2011 02:38AM UTC
Last modified March 09, 2012 09:01AM UTC
jQuery.support.opacity = false in the Chrome browser
| Reported by: | piotrl86 | Owned by: | timmywil |
|---|---|---|---|
| Priority: | high | Milestone: | 1.7 |
| Component: | support | Version: | 1.4a1 |
| Keywords: | opacity chrome | Cc: | |
| Blocked by: | Blocking: |
Description
I found that jQuery.support.opacity = false in the Chrome browser but I think it should be true because the css property works fine for me.
Tested on Linux, browser version: 4.0.203.2.
I checked the source code for jQuery 1.3.2 and I found that in Chrome browser:
[some HTML Element].style.opacity = "0,5"
but in other browsers like Firefox:
[some HTML Element].style.opacity = "0.5"
line 3159 in jquery-1.3.2.js:
opacity: a.style.opacity === "0.5",
but "0.5" is not equal to "0,5"
Cheers, Piotr Labudda
Attachments (0)
Change History (11)
Changed September 02, 2009 11:13PM UTC by comment:1
Changed October 01, 2009 11:05AM UTC by comment:2
I've the same issue with Google Chrome 4.0.213.1 on Linux but not with Chrome 3.0.195.24 on Windows.
Changed October 06, 2009 10:46AM UTC by comment:3
In fact it's not a bug in jQuery, it's a bug in Chrome http://code.google.com/p/chromium/issues/detail?id=22782 that comes from an old bug in Webkit https://bugs.webkit.org/show_bug.cgi?id=18994
It depends on your locale
Changed December 05, 2009 04:22AM UTC by comment:4
It seems that both Chrome and WebKit bugs were fixed recently.
However, we have lots of browsers (everything webkit-based that was released at least since May 2008 till Nov 2009) that experience this issue. I think that it is a good idea to add some kind of workaround for these browsers (see above).
Changed December 10, 2009 04:37AM UTC by comment:5
| resolution: | → fixed |
|---|---|
| status: | new → closed |
| version: | 1.3.2 → 1.4a1 |
Changed December 10, 2009 04:38AM UTC by comment:6
| component: | core → support |
|---|
Changed September 30, 2011 01:04AM UTC by comment:7
| milestone: | 1.4 |
|---|---|
| resolution: | fixed |
| status: | closed → reopened |
Changed September 30, 2011 01:06AM UTC by comment:8
| _comment0: | From http://bugs.jquery.com/ticket/10384 \ \ > I know this is a dublicate of 'Ticket #5145'. I can't reopen it :-( \ \ My phone (a webkit clone) throws an error on FadeIn() and fadeOut(). \ That's because it returns 'false' for '$.support.opacity'. \ Then it triggers the IE only 'cssHooks.opacity' and chunks on \ 'style.removeAttribute'. \ The real problem is that when setting style.opacity to '.55' and then read it, it says: '0,550000011920929' (note the comma and the rounding error). \ \ Now if I simply add this to my code: \ \ {{{ \ jQuery.support.opacity = true; \ jQuery.cssHooks.opacity = undefined; \ \ }}} \ \ everything is fine, fadeIn() works like show() and fadeOut() works like hide() - a lot better than an error. \ \ So, basically we need to change the test for 'support.opacity', so it includes the above value, but still excludes old IE. \ Line 1221 currently says: \ \ \ {{{ \ opacity: /^0.55$/.test( a.style.opacity ), \ \ }}} \ \ By removing the '$' sign it should work: \ \ \ {{{ \ opacity: /^0.55/.test( a.style.opacity ), \ \ }}} \ → 1317344812955394 |
|---|
From http://bugs.jquery.com/ticket/10384
I know this is a dublicate of 'Ticket #5145'. I can't reopen it :-(
My phone (a webkit clone) throws an error on FadeIn() and fadeOut(). That's because it returns 'false' for '$.support.opacity'. Then it triggers the IE only 'cssHooks.opacity' and chunks on 'style.removeAttribute'. The real problem is that when setting style.opacity to '.55' and then read it, it says: '0,550000011920929' (note the comma and the rounding error).
Now if I simply add this to my code:
jQuery.support.opacity = true;
jQuery.cssHooks.opacity = undefined;
everything is fine, fadeIn() works like show() and fadeOut() works like hide() - a lot better than an error.
So, basically we need to change the test for 'support.opacity', so it includes the above value, but still excludes old IE. Line 1221 currently says:
opacity: /^0.55$/.test( a.style.opacity ),
By removing the '$' sign it should work:
opacity: /^0.55/.test( a.style.opacity ),
Changed October 07, 2011 12:48AM UTC by comment:9
| milestone: | → 1.7 |
|---|---|
| priority: | major → high |
| status: | reopened → open |
Changed October 10, 2011 04:24PM UTC by comment:10
| owner: | → timmywil |
|---|---|
| status: | open → assigned |
Changed October 12, 2011 02:38AM UTC by comment:11
| resolution: | → fixed |
|---|---|
| status: | assigned → closed |
Leave the opacity test unanchored in case of floating point rounding browser errors; small fix in queue tests. Fixes #5145.
Changeset: a18645c6f8f5d8d84c4d47c7137683ac7b4098cc
Confirm it here, on Linux too. Had to create patched jquery in order to make transparency effects work in Chrome/Chromium. Just changed this line to