最近做一个页写了一个星期，觉得自己对jquery还是很不熟悉
自己查了一下资料写了几个封装好的tab选项卡、轮播图、无缝滚动
1 $(function(){ 2 //tab选项卡 3 jQuery.tab=function(objNav,oClassName,oBox){ //定义参数 4 var obj=$(objNav); //传参对象 5 var objWrap=$(oBox); 6 var oCN=oClassName; 7 var oUl=objWrap.children('ul'); 8 obj.children('li').click(function(){ 9 $(this).siblings('li').removeClass(oCN); 10 $(this).addClass(oCN); 11 objWrap.children('div').css('display','none'); 12 objWrap.children('div').eq($(this).index()).css('display','block'); 13 return false; 14 }); 15 }; 16 $.tab('.r_nav','r_active','.r_wrap');//对目标参数定义 （下面的也是一样定义对象：class 或者是ID名） 17 $.tab('.wtr','l_active','.listen'); 18 $.tab('#nav ul','active'); 19 //自动切换 20 jQuery.tab1=function(objNav,oClassName,oBox){ 21 var obj=$(objNav); 22 var objWrap=$(oBox); 23 var objLi=obj.children('li'); 24 var oCN=oClassName; 25 var oUl=objWrap.children('ul'); 26 var oLi=oUl.children('li'); 27 var time=null; 28 var i=0; 29 first(); 30 auto(); 31 function first(){ 32 $(oLi[0]).css('zIndex',1); 33 }; 34 function auto(){ 35 setInterval(action,5000); 36 }; 37 function action(){ 38 39 if(i>6){ 40 i=0 41 } 42 else{ 43 objLi.eq(i).addClass(oCN); 44 objLi.eq(i).siblings('li').removeClass(oCN); 45 $(oLi[i]).css('zIndex',1); 46 $(oLi[i]).siblings('li').css('zIndex',-1); 47 ++i; 48 } 49 50 } 51 objLi.click(function(){ 52 $(this).siblings('li').removeClass(oCN); 53 $(this).addClass(oCN); 54 oLi.eq($(this).index()).css('zIndex',999); 55 oLi.eq($(this).index()).siblings('li').css('zIndex',0); 56 return false; 57 }); 58 }; 59 $.tab1('.n_turn','active','.wrap'); 60 61 62 63 jQuery.showOrhide=function(Wrap){ 64 var oWrap=$(Wrap); 65 var oUl=oWrap.children('ul'); 66 var oLi=oUl.children('li'); 67 var Width=(oLi[0].offsetWidth)*(oLi.length); 68 oLi.mouseover(function(){ 69 $(this).children('a.message').css('display','block'); 70 }); 71 oLi.mouseout(function(){ 72 $(this).children('a.message').css('display','none'); 73 }); 74 } 75 $.showOrhide('.p_wrap'); 76 //无缝滚动图片轮播 77 jQuery.changeImage=function(Wrap){ 78 var oWrap=$(Wrap); 79 var oUl=oWrap.children('ul'); 80 var oLi=oUl.children('li'); 81 var Width=(oLi[0].offsetWidth)*(oLi.length)*2; 82 var time=null; 83 oUl.css('width',Width+'px'); 84 oUl.append(oUl.children('li').clone(true)); 85 auto(); 86 function auto(){ 87 time = setInterval(showImg,25); }; 88 function showImg (){ 89 var Left = parseInt(oUl.css('left')); 90 Left > -Width/2 ? Left-- : Left = 0; 91 oUl.css({left:Left+"px"});}; 92 oWrap.hover( 93 function(){ 94 clearInterval(time); }, 95 function(){ 96 auto(); 97 }); 98 99 } 100 $.changeImage('.p_wrap'); 101 })
写得不是很好，求大神不吝赐教