Transparencies look rubbish in IE6

[GoogleCodeExporter]

Transparencies look rubbish in IE6.  Particularly the emoticons.

Original issue reported on code.google.com by shortb...@gmail.com on 13 Apr 2010 at 6:31

[GoogleCodeExporter]

Jajajaa... When are the emoticons transparent? Do you mean when the 
(transparent) overlay is over the 
emoticons?

Original comment by danigb on 13 Apr 2010 at 4:00

• Changed state: Accepted

[GoogleCodeExporter]

I think this is about the icon transparent backgrounds.

The ui icons are all jpeg (!) now in IE6 with a white background as IE6 didn't 
like 
the png icons. We could try colouring these backgrounds according to where the 
icons 
appear in the app, but I actually think the white backgrounds will work best in 
most 
situations.

As for the emoticons, I just tested this with IE6 and the emoticon css messes 
them up 
completely! Had a quick look at the code and it was quicker to fix the emoticon 
css 
problem than to explain what was causing it!

The emoticons currently have a grey background in IE6 as it doesn't handle the 
png 
transparency correctly. We could add jpg images with a white background as we 
have 
for the ui icons, or we could apply some ie6 png fix code such as 
http://www.twinhelix.com/css/iepngfix/

Original comment by ashward....@gmail.com on 22 Apr 2010 at 11:44

[GoogleCodeExporter]

I think some kind of png fix in IE6 is a future investiment... I would be 
really nice to have the same icons for all 
the platforms, isn't it? Other option (i like less because the license issues 
with gif format files) is move all the 
png's to gif's... maybe we can solve the issue.

Original comment by danigb on 26 Apr 2010 at 9:27

[GoogleCodeExporter]

GIF's are now patent free:
http://burnallgifs.org/archives/
The only doubt is the 256 color limit. It may be feasible for our small icons.

Original comment by antonio....@gmail.com on 26 Apr 2010 at 9:36

[GoogleCodeExporter]

I did try converting them to gifs when I had the IE6 problem originally. Didn't 
work 
though as gwt converts them to a single large png. This is why I went for jpeg 
- 
because then gwt converts then into a big jpeg!

I agree that it would be great to use the same icon set for all platforms - the 
jpeg 
icons are just a workaround. I'm not too keen on using gifs across the board as 
they 
don't support alpha transparency and so would have to be made separately for 
each 
background colour. We could use 8-bit pngs with transparency as these can have 
alpha 
transparency on browsers that support it (but still have basic transparency in 
IE6). 
I think in all cases gwt will convert these to 32-bit pngs though when creating 
the 
sprite images so we would have to override this behaviour somehow.

Original comment by ashward....@gmail.com on 26 Apr 2010 at 10:00

[GoogleCodeExporter]

I see... give your responses, I would try to find a kind of png fix for ie6... 
256 colors is too limiting and the same 
icons for all platforms I think is a must... any of you know any good and 
proved solution?

Original comment by danigb on 26 Apr 2010 at 10:05

• Added labels: Component-Hablar

[GoogleCodeExporter]

This might be useful:
http://24ways.org/2007/supersleight-transparent-png-in-ie6

Original comment by antonio....@gmail.com on 26 Apr 2010 at 10:19

[GoogleCodeExporter]

Looks good, but I think we may be out of luck as it says that background 
position isn't 
supported (which is required for the image sprite handling).

:(

Original comment by ashward....@gmail.com on 26 Apr 2010 at 10:52

[GoogleCodeExporter]

Hmmm. Looking again at the link I sent through the other day 
http://www.twinhelix.com/css/iepngfix/ it says that background positioning is 
supported. Could be good!

Original comment by ashward....@gmail.com on 26 Apr 2010 at 10:55

[GoogleCodeExporter]

After some googling:
http://groups.google.com/group/google-web-
toolkit/browse_thread/thread/d70cd8964b4dfdb0/7c8c128e1c391db7?
lnk=gst&q=ie6+transparency#7c8c128e1c391db7

Original comment by danigb on 26 Apr 2010 at 10:58

[GoogleCodeExporter]

To shortblue, the owner of the issue: are you working on it? Mind if I take it?

Original comment by antonio....@gmail.com on 11 May 2010 at 9:49

[GoogleCodeExporter]

Original comment by antonio....@gmail.com on 11 May 2010 at 11:39

[GoogleCodeExporter]

Today I feel a bit stupid :-D
The solution was right under our nose and we couldn't see it.
I tried all the PNG fixes suggested here and others. The twin helix does not 
work at 
all, the DD_belatedPNG has problems with jQuery (probably jGrowl? who knows) 
that 
causes a Javascript error.
When at one point, after a bit of frustrated googling, I got this:

http://code.google.com/p/google-web-
toolkit/source/browse/trunk/user/src/com/google/gwt/user/client/ui/impl/ClippedI
mageI
mplIE6.java

This is the implementation of how GWT does for managing PNG alpha channels in 
IE6. So 
the idea: what if I try using an image bundle?
http://code.google.com/webtoolkit/doc/latest/DevGuideUiImageBundles.html

I converted the menu icon to try and, surprise, transparency now works even 
under 
IE6!

Expect a major conversion using an image bundle soon!

GWT rocks, definitely!

Original comment by antonio....@gmail.com on 12 May 2010 at 9:58

[GoogleCodeExporter]

Nice!! Thats a good one!! Congrats!!

Some issue related (probably I will create a new issue for that): Currently we 
have two slightly  different icon sets, 
but i would like to make them interchangeable easely... any suggestion to 
accomplish that?

Saludos

Original comment by danigb on 12 May 2010 at 10:02

[GoogleCodeExporter]

If you want to interchange them at compile time, I believe (didn't try) that 
you can 
use the <replace-with> directive in your module XML. Take a look at how 
HablarCore.gwt.xml does for IE6 pictures.
Or do you want to change them at runtime, like in a preference?

Original comment by antonio....@gmail.com on 12 May 2010 at 10:14

[GoogleCodeExporter]

I was thinking compile time... Maybe the <replace-with> is enough...

Original comment by danigb on 12 May 2010 at 10:19

[GoogleCodeExporter]

This issue was closed by revision r1469.

Original comment by antonio....@gmail.com on 18 May 2010 at 12:46

• Changed state: Fixed