?
Solved

animated png fix for ie8 animation

Posted on 2011-09-22
2
Medium Priority
?
969 Views
Last Modified: 2012-06-21
After a few hours of trying the many fixes to the png black border problem I am turning to the experts.
The link will take you to a simple animated banner http://www.soundsairpark.com/test.php

My pngs fade in fine on all brewers except IE8. I have literally tried everything to stop the black border appearing around the png while it fades in.
Can anyone help?
N

PS: I have applied this class to my images but still no luck:
.png-fix {
    background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */    
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
    zoom: 1;
}
0
Comment
Question by:Neil_Bradley
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 4

Accepted Solution

by:
Somersault earned 2000 total points
ID: 36580743
That's the problem with IE8 and alpha channels in PNGs. Whenever you change the fade:ing it still ends up creating ugly-looking black borders. AFAIK there's no way to solve this except for adapting your image so there's no semi-transparent pixels.
0
 
LVL 5

Author Closing Comment

by:Neil_Bradley
ID: 36595984
Hi Somersault and thanks for commenting on my question. I have come to conclusion that you are correct and that there is now way to solve my question.

I have awarded you the points and closed this question.
Cheers,
N
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

How to build a simple, quick and effective accordion menu using just 15 lines of jQuery and 2 css classes
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
The viewer will learn how to dynamically set the form action using jQuery.
Suggested Courses
Course of the Month13 days, 22 hours left to enroll

801 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question