在Safari＆amp;中没有处理document.ready的脚本Chrome（FF好的），但适用于document.resize

Question

我有以下jquery脚本来调整图像大小并给它左边距以使其水平居中。该脚本在FF中运行良好，但在Safari和Chrome中我遇到了问题。

Safari＆amp; Chrome问题：图片调整大小正常，但是在调整图像大小之前，leftMargin似乎设置为，导致图像被推得太远。仅在document.ready上发生此问题。调整浏览器大小时，脚本运行正常。

function imageresize() {
    var h = $(window).height(),
        w = $(window).width(),
        newHeight = h * 0.5,
        newTopMargin = newHeight * 0.12;

        $('img.resize').css({'height' : newHeight + 'px', 'margin-top' : '-' + newTopMargin + 'px'});
    var leftMargin = (w - ($('img.resize').width()))/2;
        $('img.resize').css('margin-left', leftMargin + 'px');

}
$(document).ready(function() {
  imageresize();
});

$(window).resize(function() {
  imageresize();
});

脚本放在</body>之前。

非常感谢任何帮助！

Answer 1

文档就绪事件可以在图像加载完成之前触发。尝试绑定到窗口或图像“load event”。

$(window).load(function() {
  imageresize();
});

// or

$('img').load(function() {
  imageresize();
});

Answer 2

如果只有一个图像，您还可以绑定到图像加载事件。

$(img).load(function() {
  imageresize();
});