又一款 jQuery 头图切换形式

头图切换是非常常用的形式，无奈每天都会出现新的需求和形式。

写过直接用函数的，写过jQuery插件形式的，这次又有新的，换个写法吧

 

 

代码

 1      $(document).ready( function (){
 2        trance.init()                   
 3      });
 4      
 5       var  trance = new  Object();
 6      trance = {
 7          sidx: 0 ,
 8          self: this ,
 9          timr: false ,
10          itvl: 6000 ,
11          area:$( " #ps1_fs1 " ),
12          panl:$( " #tab-list " ),
13          prev:$( " #tab-list " ).find( " .tab-back " ),
14          next:$( " #tab-list " ).find( " .tab-forward " ),
15          hdlr:$( " #tab-list " ).find( " li " ).slice( 1  ,  5 ),
16          hnow:$( " #tab-list " ).find( " li " ).eq( 1 ),
17          mimg:$( " #ps1_fs1 " ).find( " div.w " ),
18          desp:$( " #ps1_fs1 " ).find( " div.rotator-content " ),
19          pnow:$( " #ps1_fs1 " ).find( " div.w " ).eq( this .sidx),
20          dnow:$( " #ps1_fs1 " ).find( " div.rotator-content " ).eq( this .sidx),
21          init: function (){
22               this .chng();
23               this .bindact();
24               this .actauto();
25              },
26          chng: function (){
27               this .hnow.html( " <a href='#nogo'> " + this .hnow.text() + " <\/a> " );
28               this .hnow = this .hdlr.eq( this .sidx);
29               this .hnow.html( " <span> " + this .hnow.text() + " <\/span> " );
30               this .pnow.hide();
31               this .dnow.hide();
32               this .pnow = this .mimg.eq( this .sidx);
33               this .dnow = this .desp.eq( this .sidx);
34               this .pnow.show();
35               this .dnow.show();            
36              },
37          bindact: function (){
38               var  _self = this ;
39               this .hdlr.bind( " click " , function (){
40                   var  idx = $( this ).index() - 1 ;
41                   if (idx == _self.sidx)  return ;
42                  _self.sidx = idx;
43                  _self.chng();
44                  });
45               this .prev.bind( " click " , function (){
46                   _self.sidx -- ;
47                   if (_self.sidx < 0 ) _self.sidx = 3 ;
48                  _self.chng();    
49                  });
50               this .next.bind( " click " , function (){
51                  _self.sidx ++ ;
52                   if (_self.sidx > 3 ) _self.sidx = 0 ;
53                  _self.chng();        
54                  });
55               this .area.hover(
56                   function (){
57                  _self.clearauto();
58                  },
59                   function (){
60                  _self.actauto();    
61                  });
62              },
63          actauto: function (){
64               var  _self = this ;
65               this .timr = setInterval( function (){_self.next.click()} , _self.itvl);
66              },
67          clearauto: function (){
68               var  _self = this ;
69               if (_self.timr){
70                  clearInterval(_self.timr);
71                  _self.timr = false ;
72                  }
73              }    
74          }

 

 

转载于:https://www.cnblogs.com/trance/archive/2010/06/21/1762013.html