jQuery实现轮播图

jQuery实现轮播图时出现ready方法外无法调用方法（函数）

 1 
 2 
 3 
 4 
 5 
 6 
 7 
27 
28 
29 

30 
31 

 调试

 

 备注

　　遇到的问题：

1. div标签未设置width和height属性导致background-image属性失效。
2. ready()方法外调用lunbo()方法无效。

 

　　解决ready()方法外调用方法（函数）问题（修改红色代码即可）：

　　方法一：

 

 1 $(document).ready(function(){
 2         $("div").css("background-image",'url('+image[0]+')');
 3     })
 4     function lunbo(){
 5         //将lunbo函数放在ready()方法外供全局调用
 6         $("div").css("background-image","url("+image[i]+")");
 7         i++;
 8         if(i > 3){
 9             i = 0;
10         }
11     }
12     setInterval("lunbo()",2000);

 

　　方法二：

 1 var lunbo;//定义全局变量
 2     $(document).ready(function(){
 3         $("div").css("background-image",'url('+image[0]+')');
 4         lunbo = function(){
 5             //将lunbo函数赋给lunbo变量
 6             $("div").css("background-image","url("+image[i]+")");
 7             i++;
 8             if(i > 3){
 9                 i = 0;
10             }
11         }
12     })
13     setInterval("lunbo()",2000);