Subversion Repositories SmartDukaan

Rev

Rev 449 | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 449 Rev 538
Line 1... Line 1...
1 
/*
 1 
/*
2 
 * 	loopedSlider 0.5 - jQuery plugin
 2 
 * 	loopedSlider 0.5.6 - jQuery plugin
3 
 *	written by Nathan Searles
3 
 *	written by Nathan Searles
4 
 *	http://code.google.com/p/loopedslider/
 4 
 *	http://nathansearles.com/loopedslider/
5 
 *
 5 
 *
6 
 *	Copyright (c) 2009 Nathan Searles (http://nathansearles.com/)
 6 
 *	Copyright (c) 2009 Nathan Searles (http://nathansearles.com/)
7 
 *	Dual licensed under the MIT (MIT-LICENSE.txt)
 7 
 *	Dual licensed under the MIT (MIT-LICENSE.txt)
8 
 *	and GPL (GPL-LICENSE.txt) licenses.
 8 
 *	and GPL (GPL-LICENSE.txt) licenses.
9 
 *
 9 
 *
10 
 *	Built for jQuery library
 10 
 *	Built for jQuery library
11 
 *	http://jquery.com
 11 
 *	http://jquery.com
- 
 
 12 
 *	Compatible with jQuery 1.3.2+
12 
 *
 13 
 *
13 
 */
 14 
 */
14 
 
 15 
 
15 
/*
 16 
/*
16 
 *	markup example for $("#loopedSlider").loopedSlider();
 17 
 *	markup example for $("#loopedSlider").loopedSlider();
Line 23... Line 24...
23 
 *				<div><img src="03.jpg" alt="" /></div>
 24 
 *				<div><img src="03.jpg" alt="" /></div>
24 
 *				<div><img src="04.jpg" alt="" /></div>
 25 
 *				<div><img src="04.jpg" alt="" /></div>
25 
 *			</div>
 26 
 *			</div>
26 
 *		</div>
 27 
 *		</div>
27 
 *		<a href="#" class="previous">previous</a>
 28 
 *		<a href="#" class="previous">previous</a>
28 
 *		<a href="#" class="next">next</a>
 29 
 *		<a href="#" class="next">next</a>
29 
 *		<ul class="pagination">
 - 
 
30 
 *			<li><a href="#">1</a></li>
 - 
 
31 
 *			<li><a href="#">2</a></li>
 - 
 
32 
 *			<li><a href="#">3</a></li>
 - 
 
33 
 *			<li><a href="#">4</a></li>
 - 
 
34 
 *		</ul>
- 
 
35 
 *	</div>
 30 
 *	</div>
36 
 *
 31 
 *
37 
*/
 32 
*/
38 
 
 33 
 
- 
 
 34 
if(typeof jQuery != 'undefined') {
39 
(function($) {
 35 
	jQuery(function($) {
- 
 
 36 
		$.fn.extend({
40 
	$.fn.loopedSlider = function(options) {
 37 
			loopedSlider: function(options) {
- 
 
 38 
				var settings = $.extend({}, $.fn.loopedSlider.defaults, options);
41
39
42 
	var defaults = {
40 
				return this.each(
43 
		container: '.container',
 41 
					function() {
44 
		slides: '.slides',
 42 
					if($.fn.jquery < '1.3.2') {return;}
45 
		pagination: '.pagination',
 43 
					var $t = $(this);
46 
		containerClick: true, // Click container for next slide
 - 
 
47 
		autoStart: 0, // Set to positive number for auto interval and interval time
 44 
					var o = $.metadata ? $.extend({}, settings, $t.metadata()) : settings;
48 
		slidespeed: 300, // Speed of slide animation
 - 
 
49 
		fadespeed: 300, // Speed of fade animation
 - 
 
50 
		autoHeight: false // Set to positive number for auto height and animation speed
 - 
 
51 
	};
 - 
 
52
- 
 
53 
	this.each(function() {
 - 
 
54
45
55 
		var obj = $(this);
 - 
 
56 
		var o = $.extend(defaults, options);
 - 
 
57 
		var pagination = $(o.pagination+' li a',obj);
 - 
 
58 
		var m = 0;
 46 
					var distance = 0;
59 
		var t = 1;
 47 
					var times = 1;
60 
		var s = $(o.slides,obj).children().size();
 48 
					var slides = $(o.slides,$t).children().size();
61 
		var w = $(o.slides,obj).children().outerWidth();
 49 
					var width = $(o.slides,$t).children().outerWidth();
62 
		var p = 0;
 50 
					var position = 0;
63 
		var u = false;
 51 
					var active = false;
64 
		var n = 0;
 52 
					var number = 0;
65
- 
 
66 
		$(o.slides,obj).css({width:(s*w)});
 53 
					var interval = 0;
67
- 
 
68 
		$(o.slides,obj).children().each(function(){
 54 
					var restart = 0;
69 
			$(this).css({position:'absolute',left:p,display:'block'});
 55 
					var pagination = $("."+o.pagination+" li a",$t);
70 
			p=p+w;
 - 
 
71 
		});
 - 
 
72
56 
 
73 
		$(pagination,obj).each(function(){
 57 
					if(o.addPagination && !$(pagination).length){
74 
			n=n+1;
 - 
 
75 
			$(this).attr('rel',n);
 58 
						var buttons = slides;
76 
			$(pagination.eq(0),obj).parent().addClass('active');
 59 
						$($t).append("<ul class="+o.pagination+">");
77 
		});
 - 
 
78
- 
 
79 
		$(o.slides,obj).children(':eq('+(s-1)+')').css({position:'absolute',left:-w});
 60 
						$(o.slides,$t).children().each(function(){
80
- 
 
81 
		if(o.autoHeight){autoHeight(t);}
 61 
							if (number<buttons) {
82
- 
 
- 
 
 62 
								$("."+o.pagination,$t).append("<li><a rel="+(number+1)+" href=\"#\" >"+(number+1)+"</a></li>");
83 
		$('.next',obj).click(function(){
 63 
								number = number+1;
84 
			if(u===false) {
 64 
							} else {
85 
				animate('next',true);
 65 
								number = 0;
86 
				if(o.autoStart){clearInterval(sliderIntervalID);}
 - 
 
87 
			} return false;
 66 
								return false;
88 
		});
 67 
							}
89
- 
 
90 
		$('.previous',obj).click(function(){
 68 
							$("."+o.pagination+" li a:eq(0)",$t).parent().addClass("active");
91 
			if(u===false) {
69 
						});
92 
				animate('prev',true);
 - 
 
93 
				if(o.autoStart){clearInterval(sliderIntervalID);}
 70 
						pagination = $("."+o.pagination+" li a",$t);
94 
			} return false;
 71 
					} else {
95 
		});
 - 
 
96
- 
 
97 
		if (o.containerClick) {
 - 
 
98 
			$(o.container ,obj).click(function(){
 72 
						$(pagination,$t).each(function(){
99 
				if(u===false) {
 73 
							number=number+1;
100 
					animate('next',true);
 74 
							$(this).attr("rel",number);
101 
					if(o.autoStart){clearInterval(sliderIntervalID);}
 75 
							$(pagination.eq(0),$t).parent().addClass("active");
102 
				} return false;
 - 
 
103 
			});
 76 
						});
104 
		}
 77 
					}
105
78 
 
106 
		$(pagination,obj).click(function(){
 - 
 
107 
			if ($(this).parent().hasClass('active')) {return false;}
 - 
 
108 
			else {
 - 
 
109 
				t = $(this).attr('rel');
 - 
 
110 
				$(pagination,obj).parent().siblings().removeClass('active');
 - 
 
111 
				$(this).parent().addClass('active');
 - 
 
112 
				animate('fade',t);
 79 
					if (slides===1) {
113 
				if(o.autoStart){clearInterval(sliderIntervalID);}
 80 
						$(o.slides,$t).children().css({position:"absolute",left:position,display:"block"});
114 
			} return false;
 81 
						return;
115 
		});
 82 
					}
116
83 
 
117 
		if (o.autoStart) {
 - 
 
118 
			sliderIntervalID = setInterval(function(){
 - 
 
119 
				if(u===false) {animate('next',true);}
 84 
					$(o.slides,$t).css({width:(slides*width)});
120 
			}, o.autoStart);
 - 
 
121 
		}
 - 
 
122
85 
 
123 
		function current(t) {
 86 
					$(o.slides,$t).children().each(function(){
124 
			if(t===s+1){t=1;}
 - 
 
125 
			if(t===0){t=s;}
 - 
 
126 
			$(pagination,obj).parent().siblings().removeClass('active');
 87 
						$(this).css({position:"absolute",left:position,display:"block"});
127 
			$(pagination+'[rel="' + (t) + '"]',obj).parent().addClass('active');
 88 
						position=position+width;
128 
		};
 89 
					});
129
90 
 
130 
		function autoHeight(t) {
 - 
 
131 
			if(t===s+1){t=1;}
 - 
 
132 
			if(t===0){t=s;}
- 
 
133 
			var getHeight = $(o.slides,obj).children(':eq('+(t-1)+')',obj).outerHeight();
 91 
					$(o.slides,$t).children(":eq("+(slides-1)+")").css({position:"absolute",left:-width});
134 
			$('.container',obj).animate({height: getHeight},o.autoHeight);
- 
 
135 
		};
- 
 
136
92 
 
137 
		function animate(dir,clicked){
- 
 
138 
			u = true;
- 
 
139 
			switch(dir){
 - 
 
140 
				case 'next':
 - 
 
141 
					t = t+1;
 - 
 
142 
					m = (-(t*w-w));
 - 
 
143 
					current(t);
 - 
 
144 
					if(o.autoHeight){autoHeight(t);}
 - 
 
145 
					$(o.slides,obj).animate({left: m}, o.slidespeed,function(){
 - 
 
146 
						if (t===s+1) {
 93 
					if (slides>3) {
147 
							t = 1;
 - 
 
148 
							$(o.slides,obj).css({left:0},function(){$(o.slides,obj).animate({left:m})});
- 
 
149 
							$(o.slides,obj).children(':eq(0)').css({left: 0});
 - 
 
150 
							$(o.slides,obj).children(':eq('+(s-1)+')').css({ position:'absolute',left:-w});
94 
						$(o.slides,$t).children(":eq("+(slides-1)+")").css({position:"absolute",left:-width});
151 
						}
 95 
					}
152 
						if (t===s) $(o.slides,obj).children(':eq(0)').css({left:(s*w)});
 - 
 
153 
						if (t===s-1) $(o.slides,obj).children(':eq('+(s-1)+')').css({left:s*w-w});
 - 
 
154 
						u = false;
 - 
 
155 
					});
- 
 
156 
					break;
96 
 
157 
				case 'prev':
 - 
 
158 
					t = t-1;
 - 
 
159 
					m = (-(t*w-w));
 - 
 
160 
					current(t);
 - 
 
161 
					if(o.autoHeight){autoHeight(t);}
 97 
					if(o.autoHeight){autoHeight(times);}
- 
 
 98 
 
162 
					$(o.slides,obj).animate({left: m}, o.slidespeed,function(){
 99 
					$(".next",$t).click(function(){
163 
						if (t===0) {
 100 
						if(active===false) {
164 
							t = s;
 101 
							animate("next",true);
165 
							$(o.slides,obj).children(':eq('+(s-1)+')').css({position:'absolute',left:(s*w-w)});
 102 
							if(o.autoStart){
166 
							$(o.slides,obj).css({left: -(s*w-w)});
 103 
								if (o.restart) {autoStart();}
167 
							$(o.slides,obj).children(':eq(0)').css({left:(s*w)});
 104 
								else {clearInterval(sliderIntervalID);}
168 
						}
 105 
							}
169 
						if (t===2 ) $(o.slides,obj).children(':eq(0)').css({position:'absolute',left:0});
 - 
 
170 
						if (t===1) $(o.slides,obj).children(':eq('+ (s-1) +')').css({position:'absolute',left:-w});
 - 
 
171 
						u = false;
 106 
						} return false;
172 
					});
 107 
					});
- 
 
 108 
 
- 
 
 109 
					$(".previous",$t).click(function(){
- 
 
 110 
						if(active===false) {
- 
 
 111 
							animate("prev",true);
- 
 
 112 
							if(o.autoStart){
- 
 
 113 
								if (o.restart) {autoStart();}
- 
 
 114 
								else {clearInterval(sliderIntervalID);}
173 
					break;
 115 
							}
174 
				case 'fade':
 116 
						} return false;
175 
					t = [t]*1;
 117 
					});
- 
 
 118 
 
- 
 
 119 
					if (o.containerClick) {
- 
 
 120 
						$(o.container,$t).click(function(){
- 
 
 121 
							if(active===false) {
176 
					m = (-(t*w-w));
 122 
								animate("next",true);
177 
					current(t);
 123 
								if(o.autoStart){
178 
					if(o.autoHeight){autoHeight(t);}
 124 
									if (o.restart) {autoStart();}
179 
					$(o.slides,obj).children().fadeOut(o.fadespeed, function(){
 125 
									else {clearInterval(sliderIntervalID);}
- 
 
 126 
								}
- 
 
 127 
							} return false;
- 
 
 128 
						});
- 
 
 129 
					}
- 
 
 130 
 
180 
						$(o.slides,obj).css({left: m});
 131 
					$(pagination,$t).click(function(){
181 
						$(o.slides,obj).children(':eq('+(s-1)+')').css({left:s*w-w});
 132 
						if ($(this).parent().hasClass("active")) {return false;}
- 
 
 133 
						else {
182 
						$(o.slides,obj).children(':eq(0)').css({left:0});
 134 
							times = $(this).attr("rel");
183 
						if(t===s){$(o.slides,obj).children(':eq(0)').css({left:(s*w)});}
 135 
							$(pagination,$t).parent().siblings().removeClass("active");
184 
						if(t===1){$(o.slides,obj).children(':eq('+(s-1)+')').css({ position:'absolute',left:-w});}
 136 
							$(this).parent().addClass("active");
- 
 
 137 
							animate("fade",times);
- 
 
 138 
							if(o.autoStart){
- 
 
 139 
								if (o.restart) {autoStart();}
185 
						$(o.slides,obj).children().fadeIn(o.fadespeed);
 140 
								else {clearInterval(sliderIntervalID);}
- 
 
 141 
							}
186 
						u = false;
 142 
						} return false;
187 
					});
 143 
					});
- 
 
 144 
 
- 
 
 145 
					if (o.autoStart) {
- 
 
 146 
						sliderIntervalID = setInterval(function(){
- 
 
 147 
							if(active===false) {animate("next",true);}
- 
 
 148 
						},o.autoStart);
- 
 
 149 
						function autoStart() {
- 
 
 150 
							if (o.restart) {
- 
 
 151 
							clearInterval(sliderIntervalID);
- 
 
 152 
							clearInterval(interval);
- 
 
 153 
							clearTimeout(restart);
- 
 
 154 
								restart = setTimeout(function() {
- 
 
 155 
									interval = setInterval(	function(){
- 
 
 156 
										animate("next",true);
- 
 
 157 
									},o.autoStart);
- 
 
 158 
								},o.restart);
- 
 
 159 
							} else {
- 
 
 160 
								sliderIntervalID = setInterval(function(){
- 
 
 161 
									if(active===false) {animate("next",true);}
- 
 
 162 
								},o.autoStart);
- 
 
 163 
							}
- 
 
 164 
						};
- 
 
 165 
					}
- 
 
 166 
 
- 
 
 167 
					function current(times) {
- 
 
 168 
						if(times===slides+1){times = 1;}
- 
 
 169 
						if(times===0){times = slides;}
- 
 
 170 
						$(pagination,$t).parent().siblings().removeClass("active");
- 
 
 171 
						$(pagination+"[rel='" + (times) + "']",$t).parent().addClass("active");
- 
 
 172 
					};
- 
 
 173 
 
- 
 
 174 
					function autoHeight(times) {
- 
 
 175 
						if(times===slides+1){times=1;}
- 
 
 176 
						if(times===0){times=slides;}
- 
 
 177 
						var getHeight = $(o.slides,$t).children(":eq("+(times-1)+")",$t).outerHeight();
- 
 
 178 
						$(o.container,$t).animate({height: getHeight},o.autoHeight);
- 
 
 179 
					};
- 
 
 180 
 
- 
 
 181 
					function animate(dir,clicked){
- 
 
 182 
						active = true;
- 
 
 183 
						switch(dir){
- 
 
 184 
							case "next":
- 
 
 185 
								times = times+1;
- 
 
 186 
								distance = (-(times*width-width));
- 
 
 187 
								current(times);
- 
 
 188 
								if(o.autoHeight){autoHeight(times);}
- 
 
 189 
								if(slides<3){
- 
 
 190 
									if (times===3){$(o.slides,$t).children(":eq(0)").css({left:(slides*width)});}
- 
 
 191 
									if (times===2){$(o.slides,$t).children(":eq("+(slides-1)+")").css({position:"absolute",left:width});}
- 
 
 192 
								}
- 
 
 193 
								$(o.slides,$t).animate({left: distance}, o.slidespeed,function(){
- 
 
 194 
									if (times===slides+1) {
- 
 
 195 
										times = 1;
- 
 
 196 
										$(o.slides,$t).css({left:0},function(){$(o.slides,$t).animate({left:distance})});
- 
 
 197 
										$(o.slides,$t).children(":eq(0)").css({left:0});
- 
 
 198 
										$(o.slides,$t).children(":eq("+(slides-1)+")").css({ position:"absolute",left:-width});
- 
 
 199 
									}
- 
 
 200 
									if (times===slides) $(o.slides,$t).children(":eq(0)").css({left:(slides*width)});
- 
 
 201 
									if (times===slides-1) $(o.slides,$t).children(":eq("+(slides-1)+")").css({left:(slides*width-width)});
- 
 
 202 
									active = false;
- 
 
 203 
								});
- 
 
 204 
								break;
- 
 
 205 
							case "prev":
- 
 
 206 
								times = times-1;
- 
 
 207 
								distance = (-(times*width-width));
- 
 
 208 
								current(times);
- 
 
 209 
								if(o.autoHeight){autoHeight(times);}
- 
 
 210 
								if (slides<3){
- 
 
 211 
									if(times===0){$(o.slides,$t).children(":eq("+(slides-1)+")").css({position:"absolute",left:(-width)});}
- 
 
 212 
									if(times===1){$(o.slides,$t).children(":eq(0)").css({position:"absolute",left:0});}
- 
 
 213 
								}
- 
 
 214 
								$(o.slides,$t).animate({left: distance}, o.slidespeed,function(){
- 
 
 215 
									if (times===0) {
- 
 
 216 
										times = slides;
- 
 
 217 
										$(o.slides,$t).children(":eq("+(slides-1)+")").css({position:"absolute",left:(slides*width-width)});
- 
 
 218 
										$(o.slides,$t).css({left: -(slides*width-width)});
- 
 
 219 
										$(o.slides,$t).children(":eq(0)").css({left:(slides*width)});
- 
 
 220 
									}
- 
 
 221 
									if (times===2 ) $(o.slides,$t).children(":eq(0)").css({position:"absolute",left:0});
- 
 
 222 
									if (times===1) $(o.slides,$t).children(":eq("+ (slides-1) +")").css({position:"absolute",left:-width});
- 
 
 223 
									active = false;
- 
 
 224 
								});
- 
 
 225 
								break;
- 
 
 226 
							case "fade":
- 
 
 227 
								times = [times]*1;
- 
 
 228 
								distance = (-(times*width-width));
- 
 
 229 
								current(times);
- 
 
 230 
								if(o.autoHeight){autoHeight(times);}
- 
 
 231 
								$(o.slides,$t).children().fadeOut(o.fadespeed, function(){
- 
 
 232 
									$(o.slides,$t).css({left: distance});
- 
 
 233 
									$(o.slides,$t).children(":eq("+(slides-1)+")").css({left:slides*width-width});
- 
 
 234 
									$(o.slides,$t).children(":eq(0)").css({left:0});
- 
 
 235 
									if(times===slides){$(o.slides,$t).children(":eq(0)").css({left:(slides*width)});}
- 
 
 236 
									if(times===1){$(o.slides,$t).children(":eq("+(slides-1)+")").css({ position:"absolute",left:-width});}
- 
 
 237 
									$(o.slides,$t).children().fadeIn(o.fadespeed);
- 
 
 238 
									active = false;
- 
 
 239 
								});
188 
					break;
240 
								break;
189 
				default:
 241 
							default:
190 
					break;
 242 
								break;
191 
				}
243 
							}
- 
 
 244 
						};
- 
 
 245 
					}
- 
 
 246 
				);
192 
			};
 247 
			}
193 
		});
 248 
		});
194 
	};
 - 
 
195 
})(jQuery);
 - 
 
196 

            249
            
		$.fn.loopedSlider.defaults = {

          

          

            -
            
 

            250
            
			container: ".container", //Class/id of main container. You can use "#container" for an id.

          

          

            -
            
 

            251
            
			slides: ".slides", //Class/id of slide container. You can use "#slides" for an id.

          

          

            -
            
 

            252
            
			pagination: "pagination", //Class name of parent ul for numbered links. Don't add a "." here.

          

          

            -
            
 

            253
            
			containerClick: true, //Click slider to goto next slide? true/false

          

          

            -
            
 

            254
            
			autoStart: 0, //Set to positive number for true. This number will be the time between transitions.

          

          

            -
            
 

            255
            
			restart: 0, //Set to positive number for true. Sets time until autoStart is restarted.

          

          

            -
            
 

            256
            
			slidespeed: 300, //Speed of slide animation, 1000 = 1second.

          

          

            -
            
 

            257
            
			fadespeed: 200, //Speed of fade animation, 1000 = 1second.

          

          

            -
            
 

            258
            
			autoHeight: 0, //Set to positive number for true. This number will be the speed of the animation.

          

          

            -
            
 

            259
            
			addPagination: false //Add pagination links based on content? true/false

          

          

            -
            
 

            260
            
		};

          

          

            -
            
 

            261
            
	});

          

          

            -
            
 

            262
            
}

          

          

            -
            
 

            263
            

          

          

            197
            

            264