jQuery - 在document.ready之前运行一个函数...但不能太早

我有一个页面，其中包含一个div，当页面加载时必须通过JS调整大小。为了做到这一点，我给它的760px“默认宽度”，然后运行下面的代码：jQuery - 在document.ready之前运行一个函数...但不能太早

function resizeList() 
{ 
    var wlwidth,iwidth,nwidth; 
    wlwidth = document.body.clientWidth - 200 - 60; 
    iwidth = 320; 
    nwidth = Math.floor(wlwidth/iwidth) * iwidth; 
    $('#list').css('width',nwidth); 
} 

$(document).ready(function(){ 
    // if we're looking at a list, do the resize-thing, now and on window resize 
    if (window.location.pathname.toString().split('/')[1] == "list") 
    { 
     resizeList(); 
     window.onresize = resizeList; 
    } 
});

但是，页面可能需要一段时间来加载作为#list div包含大量的图片。因此，只有在所有内容完成加载后，才会扩展div以填充正确的宽度。我不能把它从$(document).ready函数中拿出来，否则它错误地说document.body是未定义的。

有没有办法在所有内容加载之前调整#list div的大小？

编辑
请参阅：http://www.google.com/images?q=whatever
他们已经取得了我想要做成功。该列表在页面加载时立即被正确确定大小，然后被填充。您可以通过调整窗口大小并观察元素的平滑移动来告诉他们通过JS来调整所有内容。可悲的是，谷歌的JS是不是世界上最容易阅读感叹

来源

2010-07-04 Mala

你可以尝试设置display：none;到#list，改变它的大小，然后通过jQuery设置display：block。我可能是错的 - 但我认为浏览器不会加载隐藏的div内的图像。 – Marko 2010-07-04 04:57:24

非常有趣的想法！我会试一试......虽然这对非JS用户来说会非常糟糕，不可撤销地隐藏#list div – Mala 2010-07-04 05:01:52

它，只要它可以运行，$(document).ready是当DOM完成渲染发生的事件。

您应该在onload上添加一个加载屏幕，然后在重新调整大小后可能会淡出它。

来源

2010-07-04 04:54:34

如果浏览器能够很好地理解部分DOM并显示它，我会认为它应该可以报告窗口的宽度...我当然可能错了 – Mala 2010-07-04 04:59:14

由于我们还没有准备好公开曝光，因此我们在回顾过程中删除了这个链接，因此我希望能够从中获得帮助你的评论。尽管谢谢你的建议！然而，谷歌图片搜索似乎完成了我正在努力完成的任务，只有他们成功完成了;） – Mala 2010-07-04 05:09:54

@Mala - 这是因为列最初是静态的，重排发生在DOM准备好之后（再次使用JS）。也许你应该为你的DIV使用默认宽度，当DOM准备就绪时，你可以用JS调整DIV。 – 2010-07-04 05:16:35

jQuery - 在document.ready之前运行一个函数...但不能太早

回答

相关问题