关于 jQuery / Css IE 7-8-9 问题的建议

Question

我正在尝试创建一个基于投资组合的网站，其中包含一堆浮动的动态陈旧图像，到目前为止，我已经通过 jQuery 和 css 为 chrome 和 Firefox 实现了它（最新版本，2012 年）

我的问题是（一如既往）IE 7-8-9，我无法理解在这个平台上可能会破坏它的原因，我最好的猜测是这是一个 jQuery 交叉问题？

check this jsFiddel

or check my online exampel here

我正在寻找一些关于我可能会出错的建议，因为我现在头发花白，试图自己解决，任何建议、想法、文章等都非常受欢迎

提前致谢 疯子

jQuery 代码：

$(window).load(function () {
    plottingData();
    resizeImage();
});

$(window).resize(function () {
    plottingData();
    resizeImage();
});

function plottingData() {
    var image = $('.box img');
    var divW = $(".box").width();
    var divH = $(".box").height();
    var imgW = image.width();
    var imgH = image.height();
    $('.outputText').html('DIV CONTAINER W: ' + divW + ' H: ' + divH + '  ::  imgW: ' + imgW + ' : imgH: ' + imgH);
}


function resizeImage() {
    $("img").each(function () {
        var maxWidth = $(".box").width();; // Max width for the image
        var maxHeight = $(".box").height();; // Max height for the image
        var maxratio = maxHeight / maxWidth;
        var width = $(this).width(); // Current image width
        var height = $(this).height(); // Current image height
        var curentratio = height / width;
        // Check if the current width is larger than the max

        if (curentratio > maxratio) {
            ratio = maxWidth / width; // get ratio for scaling image
            /*
            $(this).css("width", maxWidth); // Set new width
            $(this).css("height", height *ratio); // Scale height based on ratio
            */
            $(this).css("width", "100%");
            $(this).css("height", "auto");
        } else {
            /*
            ratio = maxHeight / height; // get ratio for scaling image
            $(this).css("height", maxHeight);   // Set new height
            $(this).css("width", width * ratio);    // Scale width based on ratio
            */
            $(this).css("width", "auto");
            $(this).css("height", "100%");
        }

    });
}

Answer 1

试试看：

...
var box = $(this).parent(".box");
var maxWidth = box.width();
var maxHeight = box.height();
...

同样的宽度plottingData 你也必须在那里迭代。 你能告诉我你得到的所有盒子和图像的高度吗？ 你很幸运，它们看起来都一样大。为每个框和图像应用规则。