for(var x=start; x<end; x++){ // 循环开始
var loadNums = 0
if(newImgArr[x]){
imgLoad[n] = new Image()
imgLoad[n].onload = function(){ // 判断是否加载图片完成
loadNums++
if(loadNums == nums){ // 本次循环的图片全部完成
console.log('完成一组')
start = start + nums // 改变索引
end = start + nums
// setTimeout(loadImgFun, 3000, start, end, nums) // 计时器,测试使用 看的更直观一些
loadImgFun(start,end,nums) // 开始下次循环
}
}
imgLoad[n].onerror = function (){
alert('img loading error!' + newImgArr[x]);
}
imgLoad[n].src = picUrl + newImgArr[x]
imgList.appendChild(imgLoad[n])
n++
}
}
var div = document.createElement('div')
div.className = 'pic'
div.setAttribute("id","pic" + z)
div.appendChild(imgLoadArr[z-1])
self.newBox.appendChild(div)
最近的项目需要做个图片的预加载,大概两千多张图吧,想实现的效果是,鼠标滚动,图片可以快速的切换并且不顿挫,在chrome中是正常的,但火狐中,始终在切换的时候有切换顿挫的问题,在控制台看图片已经下载了,尝试把图片插入到dom中,用visibility: hidden隐藏,没有解决问题
但鼠标滑动过的图片,在回来从新切换,就是ok的,这个和火狐的渲染机制有关系吗?哪位大神可以指点下?
修改成切换img的src,问题消失了