2011-11-25 89 views
2

我有一个脚本来为每个页面调整背景图像的大小。碰巧有时候较慢的机器和含有大量内容的页面(其他图像)背景图像会变得拉长。在脚本之前加载图像

Inittialy我有这个

$(document).ready(function() { 
    ...code for resizing the image... 
}); 

和我决定,这只是图像后执行(id为img_bg)的代码加载,所以:

$("#img_bg").ready(function() { 
    ...code for resizing the image... 
}); 

我得到更好的结果,但仍然不尽如人意。

有没有人有任何其他的想法?

由于

回答

2

根据jQuery的文档[1] 。就绪()真后,才元件完全加载执行。 所以你的问题可能是,在你的调整脚本完成它的工作之前有一个角度时间。 (特别是如果其他事情要同时处理)解决这个问题的一种方法是简单地隐藏图像,直到完成调整大小为止。 在缩放方法末尾使用显示 [2]函数,并在此css中为#img_bg最初设置display="none"

但是,您应该考虑一下您的整个设置。如果您只使用较小的图像,那么加载较大的图像然后用javascript重新设置它永远不会很聪明。那么最好有一个更小的开始(为了节省带宽,并因此增加加载速度)

而另一个想法是,这个调整大概可能会实现一个聪明的使用一些CSS而不是JavaScript。但是,因此你必须提供一些关于你的脚本如何工作以及它在做什么的更多细节。

[1] http://api.jquery.com/ready/

[2] http://api.jquery.com/show/

+0

感谢您的解释。很有用。关于用css调整图像的大小我已经尝试了过去,但与javascript一样成功。它所做的是比较浏览器的宽度和高度值,并调整图像的宽度或高度。然后将图像的中心定位在浏览器画布的中心,最后调用window.resize函数。只要我到达计算机,我就会尝试一下关于隐藏的提示,并在调整大小后显示图像。非常感谢 – peterK

0

如果立即将JavaScript代码的DIV/HTML控件后,那么它仍然会执行时控制准备好了,你不需要一个“准备好“声明。

document.ready只是表示所有HTML都已加载,您可以对dom执行任何操作,但您可以在整个页面准备就绪之前修改元素。

+0

但是网站的所有网页都需要调整图片大小的功能。而且这个功能不是3-5线,它有大约40线。我不认为将所有代码放在每一页中都是非常正确的。谢谢 – peterK

相关问题