如何在背景圖片加載完成之后顯示頁面內容


首先后去后端數據,看看需要加載什么圖片,共幾個圖片

 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;
                        }
                    })
                }
            }

  輕松搞定!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM