如何在背景图片加载完成之后显示页面内容
首先后去后端数据,看看需要加载什么图片,共几个图片
for (var i = 0; i < that.vClassList.length; i++) { if(that.vClassList[i].msgTypeCode=='18'){ that.imgArray.push("./module/images/online-bg.png"); that.imgArray.push("./module/images/correct.png"); that.imgArray.push("./module/images/study.png"); }else if(that.vClassList[i].msgTypeCode=='20'){ that.imgArray.push("./module/images/gxh-bg.png") that.imgArray.push("./module/images/study.png"); that.imgArray.push("./module/images/unlock.png"); }else if(that.vClassList[i].msgTypeCode=='10'){ that.imgArray.push("./module/images/after-bg.png"); that.imgArray.push("./module/images/play.png"); }else if(that.vClassList[i].msgTypeCode=='23'){ that.imgArray.push("./module/images/picture-bg.png"); }else{ that.imgArray.push("./module/images/oracy-bg.png"); } };
然后根据得到的url,也就是图片地址,进行加载图片
isImgLoad:function(callback){ var _this = this; for(var i = 0 ; i < _this.imgArray.length ; i++){ var img = new Image() img.src = _this.imgArray[i] _this.imgArrayLoad.push(img) $(img).on('load',function(){ console.log($(this).attr("src")) // $(this).remove(); _this.flag++ if(_this.flag==_this.imgArray.length){ _this.loading = false; } }) } }
轻松搞定!