Development PNGs with odd transparency

Discussion in 'Software' started by jezmck, 4 Feb 2004.

  1. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    Hi all,
    First off, I understand how PNGs have an alpha channel and all that, and I know that no browser seems to properly support PNGs.

    If I have a PNG (with transparency) on a HTML page, the wrong colour 'shows through'. Is this an IE issue? Any ideas?
    Sample here. For me, the page BG is white, but the image background is grey. Do you get the same?
     
  2. 486hawk

    486hawk What's a Dremel?

    Joined:
    18 Jul 2003
    Posts:
    213
    Likes Received:
    0
    Last edited: 4 Feb 2004
  3. The Savior

    The Savior What's a Dremel?

    Joined:
    28 Sep 2002
    Posts:
    262
    Likes Received:
    0
    PNG compatibility is a known problem for IE. I know that Opera displays them correctly, but I'm not sure about other browsers.
     
  4. Hamish

    Hamish What's a Dremel?

    Joined:
    25 Nov 2002
    Posts:
    3,649
    Likes Received:
    4
    yep, ie cant display transparency in png's, everything else can tho :D
     
  5. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    well looking at the screen shot provided by 486hawk netscape isn't displaying it properly either - it's blending the transparency with black instead of white.
    guess i'll have to not bother with PNGs for a few years...
     
  6. Hamish

    Hamish What's a Dremel?

    Joined:
    25 Nov 2002
    Posts:
    3,649
    Likes Received:
    4
    this is what it looks like in firebird
     
  7. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    thanks Hamish - that's how it should look. but given that 80.5% of the visitors to my site use MSIE6, looks like i really will have to wait for proper support. :(
     
  8. JazzXP

    JazzXP Eh! Steve

    Joined:
    30 Apr 2002
    Posts:
    1,669
    Likes Received:
    13
    Hahaha, good luck! Actually, you can get PNG transparency working in IE... do a search on MSDN for filter:progid:DXImageTransform.Microsoft.AlphaImageLoader

    Watch out though, I tried doing that with rollover buttons and it would occationally crash IE, but it's fine for static images.
     
  9. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    Thanks JazzXP - will have a look at that. :)
     
  10. ouija

    ouija Trust me, I am doctor!

    Joined:
    10 Nov 2002
    Posts:
    3,026
    Likes Received:
    2
    Can't you just use GIF format or is there a reason for you wanting PNG?
     
  11. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    I have got the AlphaImageLoader technique working (a little help from howtocreate).

    Ouija: I wanted a particular look only achievable with alpha transparency, but will probably stick to GIFs for now.

    (see here for a demo (IE4+ only sorry), the difference is only slight - the shadow fades to fully transparent in the top image (a PNG) whereas it fades to white, then cuts to transparent in the second)

    PS the background is a white GIF with transparent dots so I can choose the colour of the lines by setting the bgcolor...
     
  12. TekMonkey

    TekMonkey I enjoy cheese.

    Joined:
    6 Dec 2002
    Posts:
    3,081
    Likes Received:
    0
    Ah, you can always rely on good 'ol Firebird :hip:. None of that screwed up "coding" (or so Microsoft calls it...IMO its crap :D)
     
  13. jezmck

    jezmck Minimodder

    Joined:
    25 Sep 2003
    Posts:
    4,456
    Likes Received:
    36
    yeah, but i can't rely on all my guests using firebird...

    could you guys do my a favour a take a screenshots of how this looks in different browsers? would really appreciate it. :thumb:
     

Share This Page