http://photo.163.com/shixiaojian089/train/28002 這是網易的一個相冊,看到後想試著做做看。
在我的制作方法中,需要獲取到每張照片的寬度,所以很自然就使用了jq的width()方法。在ff跟ie下運行問題不大,但是到了chrome上,就出現問題了。
使用alert排查,發現chrome下width方法取到的值都是0.這樣子的話,想來就是腳本運行到這的時候圖片根本沒加載好。問題應該出在$(function(){});上,因為這個方法只要求加載完dom就開始運行。那麼改成在onload下執行,果然這下可以了。不過這明顯不是很好的辦法,畢竟在onload下運行要等到整個文件全部內容全部加載好後再運行腳本。
網上搜索一下後,發現這哥麼http://www.jb51.net/article/50402.htm也遇到了同樣的問題,在其的評論下方有一種解決方案,可以參考:
在要獲取圖片寬高的地方用
. 代碼如下:
$img.load(function(){
var img_h = $img.height();
var img_w = $img.width();
}
這樣可以仍舊使用$(function(){});在需要圖片加載的地方對圖片對象調用load方法,避免等待整個文件內容加載完畢。