Javascript IE8 jQ集合CSS属性（宽度或边距）被忽略

今天，当我试图操纵图像时，我遇到了一个关于IE8的有趣情况

我正在通过更改加载的图像的url来替换它们，当它们加载时，我会尝试正确地挤压它们并将其居中于视口元素（新图像不像它们的前一个图像那样是方形的）。 但在IE8中（还没有测试过IE7，并且听同事说IE9很好），图像没有缩放，只是以原始大小和我的

img.height(105);
img.css('margin-left', (shift?-shift:0));

这些都被忽略了。 下面是问题代码

    $('.people-images img').each(function () {
        var img = $(this);
        var oUrl = img.attr('src');

        oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');

        img.bind('load', function () {
            var img = $(this);
            if (this.width > this.height) {
                var shift = (this.width / (this.height / 105) - 105) / 2;
                img.height(105);
                img.css('margin-left', (shift?-shift:0));
            }
            else {
                var shift = (this.height / (this.width / 105) - 105) / 2;
                img.width(105);
                img.css('margin-top', (shift?-shift:0));
            }
        });

        img.attr('src', oUrl);
        img.attr('style', null);
        img.parent().attr('style', null);
    });

$('.people-images img').each(function () {
    var img = $(this);
    var oUrl = img.attr('src');

    oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');
    img.attr('style', null);

    img.bind('load', function () {
        var img = $(this);
        if (this.width > this.height) {
            var shift = (this.width / (this.height / 105) - 105) / 2;
            img.height(105);
            img.css('margin-left', (shift?-shift:0));
        }
        else {
            var shift = (this.height / (this.width / 105) - 105) / 2;
            img.width(105);
            img.css('margin-top', (shift?-shift:0));
        }
    });

    img.attr('src', oUrl);
    img.parent().attr('style', null);
});

---

请寻找我的自我答案，以找到解决方案。

问题原来是IE映像缓存及其处理事件处理程序的方式。 我在这行

img.attr（'style'，null）中清除了css。因此，简单地将这种样式的删除移到顶部就解决了问题

    $('.people-images img').each(function () {
        var img = $(this);
        var oUrl = img.attr('src');

        oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');

        img.bind('load', function () {
            var img = $(this);
            if (this.width > this.height) {
                var shift = (this.width / (this.height / 105) - 105) / 2;
                img.height(105);
                img.css('margin-left', (shift?-shift:0));
            }
            else {
                var shift = (this.height / (this.width / 105) - 105) / 2;
                img.width(105);
                img.css('margin-top', (shift?-shift:0));
            }
        });

        img.attr('src', oUrl);
        img.attr('style', null);
        img.parent().attr('style', null);
    });

$('.people-images img').each(function () {
    var img = $(this);
    var oUrl = img.attr('src');

    oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');
    img.attr('style', null);

    img.bind('load', function () {
        var img = $(this);
        if (this.width > this.height) {
            var shift = (this.width / (this.height / 105) - 105) / 2;
            img.height(105);
            img.css('margin-left', (shift?-shift:0));
        }
        else {
            var shift = (this.height / (this.width / 105) - 105) / 2;
            img.width(105);
            img.css('margin-top', (shift?-shift:0));
        }
    });

    img.attr('src', oUrl);
    img.parent().attr('style', null);
});

我发现这很奇怪，因为即使缓存的映像被立即加载，IE如何触发在执行范围中间的回调？
我猜，在src替换之前放置与样式相关的代码也应该有效，但我没有确认这一点

img.attr('style', null);
img.attr('src', oUrl);

希望这有帮助
 问题原来是IE映像缓存及其处理事件处理程序的方式。
我在这行
img.attr（'style'，null）中清除了css。因此，简单地将这种样式的删除移到顶部就解决了问题

    $('.people-images img').each(function () {
        var img = $(this);
        var oUrl = img.attr('src');

        oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');

        img.bind('load', function () {
            var img = $(this);
            if (this.width > this.height) {
                var shift = (this.width / (this.height / 105) - 105) / 2;
                img.height(105);
                img.css('margin-left', (shift?-shift:0));
            }
            else {
                var shift = (this.height / (this.width / 105) - 105) / 2;
                img.width(105);
                img.css('margin-top', (shift?-shift:0));
            }
        });

        img.attr('src', oUrl);
        img.attr('style', null);
        img.parent().attr('style', null);
    });

$('.people-images img').each(function () {
    var img = $(this);
    var oUrl = img.attr('src');

    oUrl = oUrl.replace(/[SM]Thumb/, 'LThumb');
    img.attr('style', null);

    img.bind('load', function () {
        var img = $(this);
        if (this.width > this.height) {
            var shift = (this.width / (this.height / 105) - 105) / 2;
            img.height(105);
            img.css('margin-left', (shift?-shift:0));
        }
        else {
            var shift = (this.height / (this.width / 105) - 105) / 2;
            img.width(105);
            img.css('margin-top', (shift?-shift:0));
        }
    });

    img.attr('src', oUrl);
    img.parent().attr('style', null);
});

我发现这很奇怪，因为即使缓存的映像被立即加载，IE如何触发在执行范围中间的回调？
我猜，在src替换之前放置与样式相关的代码也应该有效，但我没有确认这一点

img.attr('style', null);
img.attr('src', oUrl);

希望这有帮助