脚本没有在Safari和Chrome上运行document.ready(FF好的),但适用于document.resize

Question

我有以下jquery脚本来调整图像大小并给它左边距以水平居中.该脚本在FF中完美运行,但在Safari和Chrome中我遇到了问题.

Safari和Chrome问题:图像调整大小正常,但左图像似乎在图像调整大小之前设置,导致图像被推得太远.仅在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

文档就绪事件可以在图像加载完成之前触发.尝试绑定到窗口或图像的加载事件.

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

// or

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