[英]IE shows black border around PNG when faded in
Here is my site: http://smartpeopletalkfast.co.uk/ppr6/ 这是我的网站: http : //smartpeopletalkfast.co.uk/ppr6/
I have PNGs with transparency fadein with jQuery. 我有使用jQuery透明度淡化的PNG。 IE8 (havnt tested with others yet) is showing black borders around the PNGs while they fade in. I know this is a recognized issue and I've tried a few methods without luck.
IE8(已经与其他人一起测试过)在PNG显示时会显示黑色边框,而它们会淡入。我知道这是一个公认的问题,我尝试了一些没有运气的方法。
However, I've noticed that the heart (the last image to load) doesn't have the black borders. 但是,我注意到心脏(最后一个要加载的图像)没有黑色边框。 Why is this one OK?
为什么这个好吗? Hopefully if I figure out why I can use it to fix the others.
希望如果我弄清楚为什么我可以用它来修复其他人。
Thanks 谢谢
UPDATE UPDATE
I'd played around with code so much I hadn't realized I'd unintentionally disabled the fade in of the heart, so thats why no borders. 我玩过代码那么多,我没有意识到我无意中禁用了内心的淡入淡出,这就是为什么没有边界。
It's a weird issue this one. 这是一个奇怪的问题。 In all the forums I've looked at their are solutions that seem to work for some people but not for others.
在我所看过的所有论坛中,他们的解决方案似乎对某些人有用,但对其他人则无用。
I know this thread is very old, anyways I found this post which worked great for me, it completely removes the black borders from PNG's in IE7, IE8. 我知道这个帖子很老了,无论如何我发现这个帖子对我很有用,它完全删除了IE7,IE8中PNG的黑色边框。
.item img {
background: transparent;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); /* IE6 & 7 */
}
You can find it int this thread http://www.sitepoint.com/forums/showthread.php?590295-jQuery-fadein-fadeout-of-transparent-png-in-IE7-and-Chrome 你可以在这个帖子中找到它http://www.sitepoint.com/forums/showthread.php?590295-jQuery-fadein-fadeout-of-transparent-png-in-IE7-and-Chrome
像这样将此属性添加到您的代码中
<img src="/someimage.png" alt="yourImageDesc" style="border-style: none" />
Using a PNG-8 worked for me. 使用PNG-8为我工作。 Their is a slight white border to the image which is in the actual file not a browser issue but in my case this looks fine.
它们是图像的略微白色边框,在实际文件中不是浏览器问题,但在我的情况下,这看起来很好。
put background color 把背景颜色
background: #E1AE07;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF); /* IE6 & 7 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
-khtml-opacity: 0.50;
-moz-opacity: 0.50;
opacity: 0.50;
i've had the same issue setting the opacity of an element using jquery as in $('div').css('opactiy',0.5);
我有同样的问题使用jquery设置元素的不透明度,如
$('div').css('opactiy',0.5);
i was able to fix it by setting a solid background color for the 'div' in concern. 我能够通过为所关注的'div'设置一个坚实的背景颜色来解决它。
simple demonstration: http://jsfiddle.net/mwXs3/3/ (compare this in firefox and ie8)... 简单的演示: http : //jsfiddle.net/mwXs3/3/ (在firefox和ie8中比较这个)...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.