脚本只在页面重新加载时工作

Question

我正在使用jQuery在水平视图网站上对齐图像，但该脚本仅在我重新加载页面时才有效。

http://joliannelm.steveforest.com/edition/roux-de-service.html

在

之前调用该脚本

这是剧本：

$(document).ready(function() {

    var width = 0;

    $('#page img').each(function() {
        width += $(this).outerWidth(true);
    });

    $('#page').css('width', width + 50);

});

重新加载页面后就可以了，但如果清除缓存，它就会重新加载......

有人知道为什么吗？感谢。

Answer 1

这可能是一个时间问题：当DOM准备就绪时会触发ready事件 - 这可能是在加载图像之前。因为你没有给图像固定width属性，所以你需要加载它们才能告诉它们的宽度。

这是load event最合适的触发器。

$(window).load(function() {  ... your code here

与ready不同，load将等待所有相关文件 - 图片，样式表，JavaScript文件等。