@@ -20,78 +20,81 @@ $('h1').html('new html').attr()
20
20
21
21
22
22
$ ( document ) . ready ( function ( ) {
23
- var timeout , manualMode = false ,
24
-
25
- $slideshow = $ ( '#slideshow' ) . prependTo ( '#main' ) ,
26
-
27
- $counter = $ ( '<div/>' ) . insertAfter ( $slideshow ) ,
28
-
29
- $controls = $ ( '<div/>' ) . insertAfter ( $slideshow ) ,
30
-
31
- $prevBtn = $ ( '<input/>' , {
32
- type : 'button' ,
33
- value : 'previous'
34
- } ) . appendTo ( $controls ) ,
35
-
36
- $nextBtn = $ ( '<input/>' , {
37
- type : 'button' ,
38
- value : 'next'
39
- } ) . appendTo ( $controls ) ,
40
-
41
- $items = $slideshow . find ( 'li' ) . hide ( ) ,
42
-
43
- total = $items . length ,
44
-
45
- updateCounter = function ( num ) {
46
- $counter . text ( num + ' of ' + total ) ;
47
- } ,
48
-
49
- getItem = function ( $item , trav ) {
50
- var $returnItem = $item [ trav ] ( ) ;
51
- return $returnItem . length ?
52
- $returnItem :
53
- $items [ ( trav == 'next' ) ? 'first' : 'last' ] ( ) ;
54
- } ,
55
-
56
- showItem = function ( $currentItem , $itemToShow ) {
57
- var $itemToShow =
58
- $itemToShow || getItem ( $currentItem , 'next' ) ;
59
-
60
- $currentItem . fadeOut ( 500 , function ( ) {
61
- $itemToShow . fadeIn ( 500 , fadeCallback ) ;
62
- } ) ;
63
- } ,
64
-
65
- fadeCallback = function ( ) {
66
- if ( manualMode ) { return ; }
67
-
68
- var $this = $ ( this ) ,
69
- $next = getItem ( $this , 'next' ) ,
70
- num = $this . prevAll ( ) . length + 1 ;
71
-
72
- // update the counter
73
- updateCounter ( num ) ;
74
-
75
- // set the timeout for showing
76
- // the next item in 5 seconds
77
- timeout = setTimeout ( function ( ) {
78
- showItem ( $this , $next ) ;
79
- } , 5000 ) ;
80
- } ,
81
-
82
- handleBtnClick = function ( e ) {
83
- clearTimeout ( timeout ) ;
84
-
85
- manualMode = true ;
86
-
87
- var $currentItem = $items . filter ( ':visible' ) ,
88
- $itemToShow = getItem ( $currentItem , e . data . direction ) ;
89
-
90
- showItem ( $currentItem , $itemToShow ) ;
91
- } ;
92
-
93
- $prevBtn . bind ( 'click' , { direction : 'prev' } , handleBtnClick ) ;
94
- $nextBtn . bind ( 'click' , { direction : 'next' } , handleBtnClick ) ;
95
-
96
- $items . eq ( 0 ) . fadeIn ( 500 , fadeCallback ) ;
97
- } ) ;
23
+ var timeout , manualMode = false ,
24
+
25
+ $slideshow = $ ( '#slideshow' ) . prependTo ( '#main' ) ,
26
+
27
+ $counter = $ ( '<div/>' ) . insertAfter ( $slideshow ) ,
28
+
29
+ $controls = $ ( '<div/>' ) . insertAfter ( $slideshow ) ,
30
+
31
+ $prevBtn = $ ( '<input/>' , {
32
+ type : 'button' ,
33
+ value : 'previous'
34
+ } ) . appendTo ( $controls ) ,
35
+
36
+ $nextBtn = $ ( '<input/>' , {
37
+ type : 'button' ,
38
+ value : 'next'
39
+ } ) . appendTo ( $controls ) ,
40
+
41
+ $items = $slideshow . find ( 'li' ) . hide ( ) ,
42
+
43
+ total = $items . length ,
44
+
45
+ updateCounter = function ( num ) {
46
+ $counter . text ( num + ' of ' + total ) ;
47
+ } ,
48
+
49
+ getItem = function ( $item , trav ) {
50
+ var $returnItem = $item [ trav ] ( ) ;
51
+ return $returnItem . length ?
52
+ $returnItem :
53
+ $items [ ( trav == 'next' ) ? 'first' : 'last' ] ( ) ;
54
+ } ,
55
+
56
+ showItem = function ( $currentItem , $itemToShow ) {
57
+ var $itemToShow =
58
+ $itemToShow || getItem ( $currentItem , 'next' ) ;
59
+
60
+ $currentItem . fadeOut ( 500 , function ( ) {
61
+ $itemToShow . fadeIn ( 500 , fadeCallback ) ;
62
+ } ) ;
63
+
64
+ } ,
65
+
66
+ fadeCallback = function ( ) {
67
+
68
+
69
+ var $this = $ ( this ) ,
70
+
71
+ num = $this . prevAll ( ) . length + 1 ;
72
+
73
+ // update the counter
74
+ updateCounter ( num ) ;
75
+ if ( manualMode ) { return ; }
76
+ $next = getItem ( $this , 'next' ) ,
77
+ // set the timeout for showing
78
+ // the next item in 5 seconds
79
+ timeout = setTimeout ( function ( ) {
80
+ showItem ( $this , $next ) ;
81
+ } , 5000 ) ;
82
+ } ,
83
+
84
+ handleBtnClick = function ( e ) {
85
+ clearTimeout ( timeout ) ;
86
+
87
+ manualMode = true ;
88
+
89
+
90
+ var $currentItem = $items . filter ( ':visible' ) ,
91
+ $itemToShow = getItem ( $currentItem , e . data . direction ) ;
92
+
93
+ showItem ( $currentItem , $itemToShow ) ;
94
+ } ;
95
+
96
+ $prevBtn . bind ( 'click' , { direction : 'prev' } , handleBtnClick ) ;
97
+ $nextBtn . bind ( 'click' , { direction : 'next' } , handleBtnClick ) ;
98
+
99
+ $items . eq ( 0 ) . fadeIn ( 500 , fadeCallback ) ;
100
+ } ) ;
0 commit comments