I'm getting some weird antialising happening on my transparent PNGs in IE - the situation appears to worsen after certain jquery animations are performed / elements are covered up by other elements, etc. I posted a few screenshots. Anyone know why this might be happening?
You can see that some images, (such as the car in the middle) display just fine. Others (like the two vehicles, which have been faded out with JQuery, display strangely after certain things happen in JQuery. And yet others, such as开发者_高级运维 the three icons in the first screenshot, just always display a little bad (notice the black outlines to the icons). Thanks for any help you can provide. I should note that these are all background images that are part of a sprite.
You can use PNG image for modern browsers because these browsers have no BG problem in jquery animation
background:url(../images/banner01.png) no-repeat right 13px;
And add this For IE ( Use another CSS file or use IE hack )
/* ie fix */
background-image:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/banner01.png",
sizingMethod="crop");
about ie css declaration: background-image
value should be none
, because the filter
property will print background images in IE.
You can use one of following solution while creating pngs for IE. - http://pornel.net/imagealpha - http://pornel.net/pngquant
Also please consider reading this article for understanding .png IE problems http://html5boilerplate.com/docs/Notes-on-using-png/
I hope this will solve your problem and get you back on track.
Cheers, Imran
This blog helps me yesterday: http://www.useragentman.com/blog/2010/09/02/how-to-make-cleartype-font-face-fonts-and-css-visual-filters-play-nicely-together/
精彩评论