-
Notifications
You must be signed in to change notification settings - Fork 1
/
carouselite.js
111 lines (93 loc) · 3.64 KB
/
carouselite.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
/**
* Carouselite - basic jquery plugin by Yair Even Or
* DEC 2013
* https://github.com/yairEO/carouselite
* Version 1.0.0
*/
(function(){
Carousel = function(settings, obj){
var that = this;
this.settings = settings;
this.obj = $(obj);
this.wrapper = $(obj).find('.wrap');
this.pageIndex = 0;
this.NumOfpages = 0; // zero-based index
this.calcs();
this.obj.on('click.carousel', '.arrow.next', function(){ that.movePage( that.pageIndex++ );return false; });
this.obj.on('click.carousel', '.arrow.prev', function(){ that.movePage( that.pageIndex-- );return false; });
if( this.settings.autoplay ){
setInterval(function(){
that.movePage( that.pageIndex++ );
}, this.settings.autoplay)
}
if( this.settings.pagination )
this.pagination();
}
Carousel.prototype = {
pagination : function(){
var paginationList = $('<ul>'),
i = this.NumOfpages + 1,
that = this;
while( i-- > 0 )
paginationList.append('<li>');
this.paginationItems = paginationList.children();
this.paginationItems.eq(0).addClass('active');
this.obj.on('click.carousel', '> ul > li', function(){
that.pageIndex = $(this).index();
that.movePage();
});
this.obj.append(paginationList);
},
calcs : function(){
var wrapper = this.wrapper[0];
if( this.settings.orientation == 'V' ){
this.maxScroll = wrapper.scrollHeight;
this.NumOfpages = this.maxScroll / wrapper.clientHeight;
}
else{
this.maxScroll = wrapper.scrollWidth - wrapper.clientWidth;
this.NumOfpages = this.maxScroll / wrapper.clientWidth;
}
},
movePage: function(){
if( this.pageIndex < 0 ){
this.pageIndex = 0;
if( this.settings.loop )
this.pageIndex = this.NumOfpages;
else return false;
}
else if( this.pageIndex > this.NumOfpages ){
this.pageIndex = this.NumOfpages;
if( this.settings.loop )
this.pageIndex = 0;
else return false;
}
// set special classes when reached first or last "page"
this.obj.removeClass('firstPage lastPage');
if( this.pageIndex == 0 )
this.obj.addClass('firstPage');
else if( this.pageIndex == this.NumOfpages )
this.obj.addClass('lastPage');
if( this.settings.orientation == 'H' )
this.wrapper.css('text-indent', -this.pageIndex*100 + '%');
else
return false // here goes code for vertical movement here
if( this.settings.pagination )
this.paginationItems.removeClass('active').eq(this.pageIndex).addClass('active');
}
}
var defaults = {
loop : true,
orientation : 'H', // H or V
autoplay : 0, // in milliseconds
pagination : true, // show bullets and track current page
};
$.fn.carouselite = function(settings){
return this.each(function(){
var $obj = $(this),
$settings = $.extend( {}, defaults, settings || {} );
carousel = $obj.data("carouselite") || new Carousel($settings, $obj),
$obj.data("carouselite", carousel );
});
};
})();