Question

我只在IE8中遇到此问题，它甚至可以在IE6上运行良好!! ...

我动态地将2个div添加到身体并对它们进行绝对定位，这样它们就会得到一个，所以它看起来就像一个div ...这样可以正常工作，直到我再透明

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);

我做了最简单的演示来展示问题：http://anferth.com/tests/divs-problem/

在演示中，首先出现两个不具有不透明度的div，它们看起来像一个，但在将不透明度设置为0.5并且div被1px分隔后（1秒，仅在IE8 中）后1秒。

此处的代码：http://jsfiddle.net/messutiEdd/MNPrq/

提前致谢

Answer 1

如果IE8中有一个像素错误，其他人无法复制，那么将页面缩放到默认级别之外的可能性很大。在某些情况下，IE似乎不太适合缩放页面，因此缩放有时会导致对象定位和图像缩放问题。

尝试重置缩放级别并查看问题是否消失。我猜想（a）你可以做很多事情，而且（b）习惯使用IE8缩放的人习惯了这些小问题，可能不会大喊大叫关于它...

Answer 2

在玩完你的样品后，我想出了这个：

    $(document).ready(function() {
    $("body").append('<div class="af_sel af_right"></div>');
    $("body").append('<div class="af_sel af_bottom"></div>');

        var _top = (screen.deviceXDPI / screen.logicalXDPI) < 1 ? 291 : 290;

        $(".af_sel.af_right").css({
            'top': _top ,
            'left': 202,
            'width': 400,
            'height': 114
        });

        $(".af_sel.af_bottom").css({
            'top': 404,
            'left': 202,
            'width': 400,
            'height': 263
        });

        $(".af_sel").css({
        'position': 'absolute',
        'display': 'none',
        'z-index': '1000'
    });

    setTimeout(function() {
        $(".af_sel").show();

        setTimeout(function(){
            $(".af_sel").css({
                'filter': ' alpha(opacity=50)'
            });
        }, 1000);
    }, 2000);
    });
    window.onresize = function()
    {

        var _top = (screen.deviceXDPI / screen.logicalXDPI) < 1 ? 291 : 290; // (screen.deviceXDPI / screen.logicalXDPI) = Zoom Level

        $(".af_sel.af_right").css({
            'top': _top ,
            'left': 202,
            'width': 400,
            'height': 114
        });
    }

当缩放到125％时仍然存在像素间隙，但是这应该会让你继续前行。获取您将使用的当前缩放系数（IE8）screen.deviceXDPI / screen.logicalXDPI 这将相对于1返回缩放，即75％= 0.75,100％= 1,025％= 1.25，等等......

祝你好运！

IE8绝对位置+不透明度问题

2 个答案: