SitePoint Sponsor

User Tag List

Results 1 to 18 of 18
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    PNG Transparency Problem

    I've tried a lot of tricks and hacks that force IE6 to display transparent PNGs with any luck. I thought that I did something wrong. But when I opened the original websites that offer the hacks, the trick didn't work either. You can see the whole block!

    Is it my browser? Does anyone knows how to make it work?

  2. #2
    SitePoint Addict
    Join Date
    May 2006
    Posts
    399
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no. upgrade to IE7 ?

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Blue Sky View Post
    no. upgrade to IE7 ?
    hi Blue Sky...

    I know IE7 and FireFox work like a charm. But designing for IE6 is a requirement! We can't force clients to upgrade.

  4. #4
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Did you install IE7 on your computer?

    IE7 changed a lot of core files that IE6 use.
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  5. #5
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by logic_earth View Post
    Did you install IE7 on your computer?

    IE7 changed a lot of core files that IE6 use.
    Yes! I have IE7 installed. Like I said in my previous post, I know that IE7 works like a charm. In fact, the problem started when I created a web application using transparency.

    On IE7 and Firefox looked awesome, but when I tested on IE6 it looked terrible. The transparency was rendered as a block. I had to change the images to JPG and GIF.

  6. #6
    SitePoint Wizard ryanhellyer's Avatar
    Join Date
    Oct 2006
    Location
    New Zealand
    Posts
    2,323
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by joey-the-menace View Post
    Yes! I have IE7 installed. Like I said in my previous post, I know that IE7 works like a charm. ... but when I tested on IE6 it looked terrible. The transparency was rendered as a block. I had to change the images to JPG and GIF.
    I think Logic-Earth is implying that by installing IE7 you have messed up the rendering engine of standalone IE6. I don't know anything about using PNG transparency with IE6 so can't help.

    A simple solution may be to provide a GIF to <IE6 and a PNG to everything else as long. Although this may not be useful for some situations.

    Ryan,

  7. #7
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Exactly, by installing IE7 the standalone version of IE6 doesn't render the hack but if the user is using IE6 non-standalone it will work just fine. In my own test this is the result I got.

    Quote Originally Posted by ryanhellyer View Post
    I think Logic-Earth is implying that by installing IE7 you have messed up the rendering engine of standalone IE6. I don't know anything about using PNG transparency with IE6 so can't help.

    A simple solution may be to provide a GIF to <IE6 and a PNG to everything else as long. Although this may not be useful for some situations.

    Ryan,
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  8. #8
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    What do you mean you had to change to JPG and GIF as PNG-8 has indexed transparency like GIF that works in IE 5.x I assume you tried PNG-24 and multiple Alpha.

  9. #9
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by xhtmlcoder View Post
    What do you mean you had to change to JPG and GIF as PNG-8 has indexed transparency like GIF that works in IE 5.x I assume you tried PNG-24 and multiple Alpha.
    Hi all... thanks for all your replies!

    In the beginning, I had all my PNGs as PNG-8. Like I mentioned before, when I checked the app on my IE6... it looked terrible because the transparency wasn't working.

    Because I needed to finish the project, I had to change all images to either JPGs or GIFs. In other words, if the image really needed to be transparent I used GIFs... if not, I used JPGs.

    I didn't know that if it was an IE6 standalone, the hack will not work. How do I know if my IE6 is not standalone? By the way, I have IE6 in one PC and IE7 in another.

  10. #10
    SitePoint Wizard ryanhellyer's Avatar
    Join Date
    Oct 2006
    Location
    New Zealand
    Posts
    2,323
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you don't know if you have a standalone then you probably don't. You would have had to intentionally install it in the first place.

    Using different IE's on different machines is definitely the best way to go.

    Basically if you have more than one version of IE on a machine then only one of them will be the actual version, the rest will be standalones. The standalones unfortunately aren't entirely 'standalone' as in they use internal Windows resources which are changed on upgrading to a new version, hence IE6 Standalone operates slightly different from normal IE6.

    One of the major bugs I've come across is that the standalones don't understand IE Conditional comments correctly and think they are whatever the current version of IE you have installed is.

    Ryan,

  11. #11
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by joey-the-menace View Post
    By the way, I have IE6 in one PC and IE7 in another.
    Thanks for your replies...

    Like I mentioned before, IE6 is on my PC and IE7 on my work laptop.

    I don't have both versions on same computer.

    The transparency hack is not working for me on IE6. Now... I understand that people will be moving to IE7 eventually (if they haven't done it already). But what can I do with the clients that still use the IE6?

  12. #12
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by joey-the-menace View Post
    The transparency hack is not working for me on IE6. Now... I understand that people will be moving to IE7 eventually (if they haven't done it already). But what can I do with the clients that still use the IE6?
    It is just you then, I just tested it working perfectly

    Internet Explorer 6 on a fresh install of Windows XP Pro
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  13. #13
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by logic_earth View Post
    It is just you then, I just tested it working perfectly

    Internet Explorer 6 on a fresh install of Windows XP Pro
    There are a few hacks. Which transparency hack you tested?

    My IE6 is on a Windows XP Home Edition. Will that be the problem?

  14. #14
    SitePoint Member kasted's Avatar
    Join Date
    Feb 2006
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can download most versions of IE here that are standalone(no installing ):
    http://browsers.evolt.org/?ie/32bit

  15. #15
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html

    Quote Originally Posted by joey-the-menace View Post
    There are a few hacks. Which transparency hack you tested?

    My IE6 is on a Windows XP Home Edition. Will that be the problem?
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.


  16. #16
    SitePoint Member
    Join Date
    Dec 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can I apply the behavior on more than one image on the same page?

  17. #17
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    63
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    WOW! Thanks... the demo on that page display propertly on my IE6.

    I finally got it and quote: "The behavior uses an image named "blank.gif". This image should be placed in the same directory as the web page using the behavior or otherwise you will have to modify the behavior file."

  18. #18
    . shoooo... silver trophy logic_earth's Avatar
    Join Date
    Oct 2005
    Location
    CA
    Posts
    9,013
    Mentioned
    8 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by webstunner View Post
    Can I apply the behavior on more than one image on the same page?
    Yes, It does it for every PNG image which could be a problem.
    Logic without the fatal effects.
    All code snippets are licensed under WTFPL.



Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •