Question

大家好我正在处理一个小图像调整大小脚本，它适用于ie和ff，但不适用于chrome。我必须刷新页面才能使它工作。我在iframe工作。继承我的代码

 function resize() {
    var maxWidth = 200;

    var width = $("#ImageMainPicture").width();
    //alert(width);
    if (width > maxWidth) {
        $("#ImageMainPicture").css("width", maxWidth);
    }

这是在jquery doc.ready上调用的。

感谢所有看过这个的人

Answer 1

$(document).ready()在加载图像之前运行。当您需要加载媒体时，请改用$(window).load(。

或者，只需使用CSS！

#ImageMainPicture {
    max-width: 200px;
}

Answer 2

请改为尝试：

$("#ImageMainPicture").width(maxWidth);

Answer 3

如果“#ImageMainPicture”是图像元素，请尝试关注，因为$（document）.ready（）时未加载图像，因此您假设将该代码放入$（window）.load（）

$(document).ready(function(){
  $(window).load(function(){
    var maxWidth = 200;
    var width = $("#ImageMainPicture").outerWidth();
    if (width > maxWidth) {
        $("#ImageMainPicture").css("width", maxWidth);
     }
  });
});

Answer 4

function resize() {
    var $img = $("img#ImageMainPicture");

    $img.onload(function () {
        var onloadInterval = setInterval(function () {
            // Make sure the image is actually loaded in IE
            if ($img[0].complete) {
                clearInterval(onloadInterval);
                $img.css("width", Math.min($img[0].width, 200));
            }
        }, 100);
    });
}

调用该函数将找到id为“ImageMainPicture”的图像，并设置onload以开始间隔。间隔检查图像对象上的完整属性，以便我们确定图像是在IE中加载的，然后将图像的宽度设置为较小的值。

这样我们就可以完全确定图像是否可以让我们操纵它的宽度。

jquery图像调整大小不适用于chrome

4 个答案: