1 $(function(){ 2 /*************初始化***************/ 3 var _img=[];//图片对象全局变量 4 5 var adjustDiv=function(){//调整DIV宽度和高度 6 var winHeight=$(window).height(); 7 var winWidth=$(window).width(); 8 $('#bgImgPPT2').css('height',winHeight); 9 $('#bgImgPPT2').css('width',winWidth); 10 //alert(winHeight+' and '+winWidth); 11 } 12 var adjustImg=function(_width,_height){//自动调整图片大小_width=>图片宽度,_height=>图片高度 13 var winHeight=$(window).height();//窗口高度 14 var winWidth=$(window).width();//窗口宽度 15 16 //alert(_width+' and '+_height); 17 18 var needH=winHeight+150;//实际需要的高度 19 var needW=winWidth;//实际需要的宽度 20 21 //alert(needH+' and '+needW); 22 23 var _tempW=_width;//缓存宽度 24 var _tempH=_height;//缓存高度 25 26 var newWH=[];//需要返回的数组 27 28 /**首先调整高度**/ 29 _tempH=needH; 30 _tempW=(_tempH/_height)*_width; 31 32 if(_tempW<=needW){//若宽度未达到,调整宽度,同时调整高度 33 var _tempW1=_tempW; 34 _tempW=needW; 35 _tempH=(_tempW/_tempW1)*_tempH; 36 } 37 newWH['height']=_tempH; 38 newWH['width']=_tempW; 39 40 return newWH; 41 } 42 var initPpt=function(){//初始化,主要是获得pageCounter的pages参数 43 $('#bgImgPPT2').html(''); 44 var imgArr=['img/test.jpg','img/test2.jpg','img/test3.jpg','img/test4.jpg','img/test5.jpg'];//图片数组 45 //console.log(imgArr.length); 46 /*********自动调整图片及DIV大小********/ 47 adjustDiv(); 48 //alert(imgArr[1]); 49 /****图片预加载****/ 50 /*for(var j=0;j<_img.length;j++){ 51 //alert(_img[j].src); 52 var imgObj=_img[j]; 53 imgObj.onload=function(){ 54 var _width=imgObj.width; 55 var _height=imgObj.height; 56 _tempWH=adjustImg(_width,_height); $('#bgImgPPT2').children('#index_'+j).attr('src',imgObj.src).width(_tempWH['width']).height(_tempWH['height']); 57 } 58 }*/ 59 for(var i=0;i<imgArr.length;i++){ 60 _img[i]=new Image(); 61 _img[i].src=imgArr[i]; 62 $('#bgImgPPT2').append('<img id="index_'+i+'" src="img/loading.gif" class="zhanwei"/>'); 63 $('#bgImgPPT2').children('#index_'+i).width($(window).width()).height($(window).height()); 64 } 65 //console.log(_img.length); 66 67 /****图片预加载****/ 68 /*********自动调整图片及DIV大小********/ 69 } 70 /*************初始化**************/ 71 /****************幻灯片*********************/ 72 initPpt();//初始化 73 /********/ 74 for(var i=0;i<_img.length;i++){ 75 alert(_img[i].src);//这里就可以获得_img这个全局变量的属性 76 _img[i].onload=function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢? 77 var _width=_img[i].width; 78 var _height=_img[i].height; 79 _tempWH=adjustImg(_width,_height);//获得调整后的尺寸 80 _img[imgIndex].width=_tempWH['width']; 81 _img[imgIndex].height=_tempWH['height']; 82 $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]); 83 } 84 } 85 /********/ 86 var ppt= ''; 87 var bgImgPPTLength = $("#bgImgPPT2").children("img").length; 88 var imgIndex=0; 89 function pptSwitch(){ 90 var bgImgPPT = $("#bgImgPPT2").children("img"); 91 //console.log(_img[imgIndex]); 92 //alert(judgeLoad(_img[imgIndex])); 93 //alert(_img[imgIndex].complete); 94 //alert($(_img[imgIndex]).attr('src')); 95 if(imgIndex%2==0){ 96 if(imgIndex>=bgImgPPT.length-1){ 97 //console.log(_img.length); 98 bgImgPPT.eq(imgIndex).animate({'top':'-50px'},2500).fadeOut(250); 99 bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1); 100 bgImgPPT.eq(0).fadeIn(250); 101 //clearInterval(ppt); 102 imgIndex=0 103 /*ppt = setInterval(function(){ 104 pptSwitch(imgIndex); 105 },3000);*/ 106 }else{ 107 bgImgPPT.eq(imgIndex).animate({'top':'-50px'},2000).fadeOut(250).next('img').fadeIn(250); 108 bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1) 109 imgIndex++; 110 } 111 }else{ 112 if(imgIndex>=bgImgPPT.length-1){ 113 //console.log(imgIndex); 114 bgImgPPT.eq(imgIndex).animate({'top':'-150px'},2000).fadeOut(250) 115 bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1) 116 bgImgPPT.eq(0).fadeIn(250); 117 //clearInterval(ppt); 118 imgIndex=0; 119 /*ppt = setInterval(function(){ 120 pptSwitch(imgIndex); 121 },3000);*/ 122 }else{ 123 bgImgPPT.eq(imgIndex).animate({'top':'-150px'},2000).fadeOut(250).next('img').fadeIn(250) 124 bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1) 125 imgIndex++; 126 } 127 } 128 } 129 /******************幻灯片******************/ 130 /************************自动执行**************************/ 131 ppt = setInterval(function(){ 132 pptSwitch(); 133 },2500); 134 /************************自动执行************************/ 135 });
代码如上,_img[i]显示undefined,请高手指点并给出解决方法,不胜感激!
你这个地方写的有问题
for(var i=0;i<_img.length;i++){ 75 alert(_img[i].src);//这里就可以获得_img这个全局变量的属性 76 _img[i].onload=function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢? 77 var _width=_img[i].width; 78 var _height=_img[i].height; 79 _tempWH=adjustImg(_width,_height);//获得调整后的尺寸 80 _img[imgIndex].width=_tempWH['width']; 81 _img[imgIndex].height=_tempWH['height']; 82 $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]); 83 } 84 }
把上面这段代码改为:
for(var i=0;i<_img.length;i++){ //alert(_img[i].src);//这里就可以获得_img这个全局变量的属性 _img[i].onload=(function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢? console.log( _img[i].src); var _width=_img[i].width; var _height=_img[i].height; _tempWH=adjustImg(_width,_height);//获得调整后的尺寸 _img[imgIndex].width=_tempWH['width']; _img[imgIndex].height=_tempWH['height']; $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]); })(); }
for循环是没有块的作用,需要让函数立即执行才可以;估计我来晚了,没有解你燃眉之急
基本如此啊。