Question

我遇到了一个问题，即在IE8中使用fadeTo获得透明度。而不是在我的背景图像（PNG）上保持透明度的淡入淡出，有一个令人讨厌的黑色边框，否则透明度将是。

我已经搜索过高低，虽然在这里有一吨似乎很好的答案，但是我无法找到一个对我有用的东西，我不知道为什么。

这是我的代码：

    jQuery(document).ready(function($) {

        InOut($('#bubblewrap li:first'));

        function InOut(elem) {
            elem.delay().fadeTo(1500, 1).delay(700).fadeTo(1500, 0, function() {
                if (elem.next().length > 0) {
                    InOut($(this).next());
                }
                else {
                    InOut($(this).siblings(':first'));
                }

            });
        }

        $('#bubblewrap li').mouseover(function() {
            $(this).siblings().add(this).stop(true, false).css("opacity", 0);
            $(this).show().css("opacity", 1);
        });
        $('#bubblewrap li').mouseout(function() {
            if ($(this).is(":visible") == true) {
                InOut($(this));
            }
        });
    });

有没有人对如何在我的代码中使用SO上的一些常见解决方案有任何建议？非常感谢任何和所有帮助。

Answer 1

IE8（作为olders IE）无法处理半透明（即png）元素的不透明度。这正是你在那里看到的。通常设置背景颜色（因此元素没有半透明像素），以及图像有帮助。

在你的情况下，你可以考虑a）不褪色但只显示IE＆lt; 9 b）使用部分jpg图像作为背景，并将png放在上面（需要额外的元素）c）用css3边框半径重新创建效果和盒子阴影让css3pie处理它。但它可能不适合动画 - 没试过这个。

在IE 8中淡出透明度问题

1 个答案: