SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Guru
    Join Date
    Aug 2009
    Posts
    636
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    IE6 PNG Hack/Fix

    Hi Guys,

    Was just wondering what would be the best fix for PNG in IE6, I know theres several way to do it but am just wondering what would you guys suggest be most effective way and if you could provide an example on how to implement it on this site I'm working on that would be great, heres the link, notice the MAKE A DONATION button is a PNG.

    http://mikenificent.com/veteransinc/

    Thanks,

    Mike

  2. #2
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,031
    Mentioned
    152 Post(s)
    Tagged
    2 Thread(s)
    Take a look at DD_belatedPNG.
    Examples of how to use it are included on the website (in the usage section).

    I like this solution best because it had less limitations than other solutions.

  3. #3
    SitePoint Guru
    Join Date
    Aug 2009
    Posts
    636
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thanks for this, do you know if there are any easy CSS tricks for solutions rather than javascript?

  4. #4
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,031
    Mentioned
    152 Post(s)
    Tagged
    2 Thread(s)
    Did you try to find a solution yourself? The web is loaded with solutions to this problem. We're not here to google solutions for you, you're supposed to be able to that yourself (unless you live in China, then you should use Baidu )

    Anyhow, take a look at this article.

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    You could link to a behavior file with CSS although that isn't really the best option (nor is it better then using JS)

    Are you apposed to using JS for this for some reason?
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    Utopia, Inc. silver trophy
    ScallioXTX's Avatar
    Join Date
    Aug 2008
    Location
    The Netherlands
    Posts
    9,031
    Mentioned
    152 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by RyanReese View Post
    You could link to a behavior file with CSS
    i.e., TwinHelix IE PNG FIX.

  7. #7
    SitePoint Guru
    Join Date
    Aug 2009
    Posts
    636
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thanks ScallioXTX I used the javascript from your first post. Unfortunately I'm on a Mac and my PC only has IE 7. Is there a site where I can test my websites to see them in IE6? If not, could someone please review the site using the hack supplied by ScallioXTX and just see if the PNG is showing up correctly as I may not have implemented it correctly.

    http://mikenificent.com/veteransinc/

    Thanks,

    Mike

  8. #8
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    could someone please review the site using the hack supplied by ScallioXTX and just see if the PNG is showing up correctly
    It's not working for me.

  9. #9
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ScallioXTX View Post
    Yes that's the ideal one I tend to recomend . I had a custom one made a year ago by a member here..worked quite well
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  10. #10
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    The JS file which you are directing the Javascript to has returned a 404

    http://mikenificent.com/veteransinc/DD_belatedPNG.js
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  11. #11
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,276
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    If you only want the odd image transparent and don't need background properties then you can just use the filter natively on an image by image basis without javascript as shown in the Sitepoint reference.

    Don't apply the filter to positioned elements that need ot ne clicked as they will become unclickable. Position the element first and then apply an inner non positioned element to hold the transparent image.

    If you have lots of images then the methods mentioned above are best as they automate the process to some degree.

    Wherever possible I will try to avoid having to use the filter or javascript and will instead use 8bit transparent pngs for IE6 (which it understands) and 32bit pngs for everyone else. Ie6 gets the lesser quality pngs which in a lot of cases don't look too bad but if there are a lot of shadows and transparency effects then the image doesn't look too hot.


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
  •