https://www.ird.gov.lk/_layouts/15/ramis/en/js/Xslider.js

1/*
2
3	Demo:
4	$(".productshow").Xslider({//.productshow是要移动对象的外框,页面上所有绑定了类.productshow的对象都会有切换效果;
5		unitdisplayed:3,//可视的单位个数   必需项;
6		numtoMove:1,//要移动的单位个数    必需项;
7		viewedSize:120,//可视宽度或高度     不传入则查找要移动对象外层的宽或高度;
8		scrollobj:".vscrollobj",//要移动的对象    不传入则查找productshow下的ul;
9		unitlen:20,//移动的单位宽或高度      不传入则查找li的尺寸;
10		scrollobjSize:$(".vscrollobj").height(),//移动最长宽或高（要移动对象的宽度或高度）   不传入则由li个数乘以unitlen计算;
11		dir:"V",//水平移动还是垂直移动       默认H为水平移动，传入V则表示垂直移动（注意是大写字母）;
12		loop:"cycle",//循环滚动            不传入则不循环滚动;
13		speed:500, //滚动速度      默认为500;
14		autoscroll:2000//自动移动间隔时间（毫秒）     不传入则不会自动移动;
15	});
16*/
17
18(function($){
19	$.extend($.easing,{
20		easeInSine: function (x, t, b, c, d) {
21			return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
22		}
23	});
24
25	$.fn.Xslider=function(settings){
26		settings=$.extend({},$.fn.Xslider.sn.defaults,settings);
27		this.each(function(){
28			var scrollobj=settings.scrollobj ? $(this).find(settings.scrollobj) : $(this).find("ul"),
29			    viewedSize=settings.viewedSize || (settings.dir=="H" ? scrollobj.parent().width() : scrollobj.parent().height()),//length of the wrapper visible;
30			    scrollunits=scrollobj.find("li"),//units to move;
31			    unitlen=settings.unitlen || (settings.dir=="H" ? scrollunits.eq(0).outerWidth() : scrollunits.eq(0).outerHeight()),
32			    unitdisplayed=settings.unitdisplayed,//units num displayed;
33				numtoMove=settings.numtoMove > unitdisplayed ? unitdisplayed : settings.numtoMove,
34			    scrollobjSize=settings.scrollobjSize || scrollunits.length*unitlen,//length of the scrollobj;
35			    offset=0,//max width to move;
36			    offsetnow=0,//scrollobj now offset;
37			    movelength=unitlen*numtoMove,
38				pos=settings.dir=="H" ? "left" : "top",
39			    moving=false,//moving now?;
40			    btnright=$(this).find("a.aright"),
41			    btnleft=$(this).find("a.aleft");
42			
43			btnright.unbind("click");
44			btnleft.unbind("click");
45					
46			settings.dir=="H" ? scrollobj.css("left","0px") : scrollobj.css("top","0px");
47							
48			if(scrollobjSize>viewedSize){
49				if(settings.loop=="cycle"){
50					btnleft.removeClass("agrayleft");
51					if(scrollunits.length<2*numtoMove+unitdisplayed-numtoMove){
52						scrollobj.find("li").clone().appendTo(scrollobj);	
53					}
54				}else{
55					btnleft.addClass("agrayleft");
56					offset=scrollobjSize-viewedSize;
57				}
58				btnright.removeClass("agrayright");
59			}else{
60				btnleft.addClass("agrayleft");
61				btnright.addClass("agrayright");
62			}
63
64			btnleft.click(function(){
65				if($(this).is("[class*='agrayleft']")){return false;}
66				
67				if(!moving){
68					moving=true;
69					
70					if(settings.loop=="cycle"){
71						scrollobj.find("li:gt("+(scrollunits.length-numtoMove-1)+")").prependTo(scrollobj);
72						scrollobj.css(pos,"-"+movelength+"px");
73						$.fn.Xslider.sn.animate(scrollobj,0,settings.dir,settings.speed,function(){moving=false;});
74					}else{
75						offsetnow-=movelength;
76						if(offsetnow>unitlen*unitdisplayed-viewedSize){
77							$.fn.Xslider.sn.animate(scrollobj,-offsetnow,settings.dir,settings.speed,function(){moving=false;});
78						}else{
79							$.fn.Xslider.sn.animate(scrollobj,0,settings.dir,settings.speed,function(){moving=false;});
80							offsetnow=0;
81							$(this).addClass("agrayleft");
82						}
83						btnright.removeClass("agrayright");
84					}
85				}
86
87				return false;
88			});
89			btnright.click(function(){
90				if($(this).is("[class*='agrayright']")){return false;}
91				
92				if(!moving){
93					moving=true;
94					
95					if(settings.loop=="cycle"){
96						var callback=function(){
97							scrollobj.find("li:lt("+numtoMove+")").appendTo(scrollobj);
98							scrollobj.css(pos,"0px");
99							moving=false;
100						}
101						$.fn.Xslider.sn.animate(scrollobj,-movelength,settings.dir,settings.speed,callback);
102					}else{
103						offsetnow+=movelength;
104						if(offsetnow<offset-(unitlen*unitdisplayed-viewedSize)){
105							$.fn.Xslider.sn.animate(scrollobj,-offsetnow,settings.dir,settings.speed,function(){moving=false;});
106						}else{
107							$.fn.Xslider.sn.animate(scrollobj,-offset,settings.dir,settings.speed,function(){moving=false;});//滚动到最后一个位置;
108							offsetnow=offset;
109							$(this).addClass("agrayright");
110						}
111						btnleft.removeClass("agrayleft");
112					}
113				}
114				
115				return false;
116			});
117			
118			if(settings.autoscroll){
119				$.fn.Xslider.sn.autoscroll($(this),settings.autoscroll);
120			}
121		})
122	}
123	
124	$.fn.Xslider.sn={
125		defaults:{
126			dir:"H",
127			speed:500
128		},
129		animate:function(obj,w,dir,speed,callback){
130			if(dir=="H"){
131				obj.animate({
132					left:w
133				},speed,"easeInSine",callback);
134			}else if(dir=="V"){
135				obj.animate({
136					top:w
137				},speed,"easeInSine",callback);	
138			}	
139		},
140		autoscroll:function(obj,time){
141			var  vane="right";
142			function autoscrolling(){
143				if(vane=="right"){
144					if(!obj.find("a.agrayright").length){
145						obj.find("a.aright").trigger("click");
146					}else{
147						vane="left";
148					}
149				}
150				if(vane=="left"){
151					if(!obj.find("a.agrayleft").length){	
152						obj.find("a.aleft").trigger("click");
153					}else{
154						vane="right";
155					}
156				}
157			}
158			var scrollTimmer=setInterval(autoscrolling,time);
159			obj.hover(function(){
160				clearInterval(scrollTimmer);
161			},function(){
162				scrollTimmer=setInterval(autoscrolling,time);
163			});
164		}
165	}
166})(jQuery);