怎麼在圖片載入成功之前用另一個圖片代替
阿新 • • 發佈:2019-01-27
很多時候,在伺服器上圖片有的時候會太大,需要一個小一點的圖片來過渡一下。
我想到使用一個onload屬性
onload的意思是在這個標籤載入完成時,執行onload中的程式
html=html+'<li><img src="img/jiazai.gif" id="loading'+eval(data)[0][3][i]+'" style="height:200px;width:200px"><img id="'+eval(data)[0][3][i]+'"src="picture/'+eval(data)[0][0][i]+'.png" onload="$("#'+eval(data)[0][3][i]+'").show();$("#loading'+eval(data)[0][3][i]+'").hide();" style="display:none;height:200px;width:200px" onclick="imgShow("#outerdiv","#innerdiv","#bigimg","#'+eval(data)[0][3][i]+'")"/><p>'+eval(data)[0][2][i]+'</p></li>';
第一個img是載入成功之前的那張圖,第二個img是需要載入的圖片,這個img的onload屬性,
當載入成功時,顯示第二張圖,隱藏第一張圖
一些loading圖片的網址:
http://www.lanrentuku.com/gif/a/loading.html