http://www.94ieat.com/Themes/zs201901115165/js/sucai.js

1function ZoomPic ()
2{
3	this.initialize.apply(this, arguments)	
4}
5ZoomPic.prototype = 
6{
7	initialize : function (id)
8	{
9		var _this = this;
10		this.wrap = typeof id === "string" ? document.getElementById(id) : id;
11		this.oUl = this.wrap.getElementsByTagName("ul")[0];
12		this.aLi = this.wrap.getElementsByTagName("li");
13		this.prev = this.wrap.getElementsByTagName("pre")[0];
14		this.next = this.wrap.getElementsByTagName("pre")[1];
15		this.timer = null;
16		this.aSort = [];
17		this.iCenter = 3;
18		this._doPrev = function () {return _this.doPrev.apply(_this)};
19		this._doNext = function () {return _this.doNext.apply(_this)};
20		this.options = [
21			{width:273, height:150, top:40, left:927, zIndex:1},
22			{width:273, height:150, top:57, left:0, zIndex:2},
23			{width:386, height:212, top:26, left:132, zIndex:3},
24			{width:462, height:254, top:0, left:360, zIndex:4},
25			{width:385, height:212, top:26, left:681, zIndex:3},
26			{width:000, height:82, top:40, left:610, zIndex:2},
27			{width:000, height:150, top:57, left:927, zIndex:1}                                   
28		];
29		for (var i = 0; i < this.aLi.length; i++) this.aSort[i] = this.aLi[i];
30		this.aSort.unshift(this.aSort.pop());
31		this.setUp();
32		this.addEvent(this.prev, "click", this._doPrev);
33		this.addEvent(this.next, "click", this._doNext);
34		this.doImgClick();		
35		this.timer = setInterval(function ()
36		{
37			_this.doNext()	
38		}, 3000);		
39		this.wrap.onmouseover = function ()
40		{
41			clearInterval(_this.timer)	
42		};
43		this.wrap.onmouseout = function ()
44		{
45			_this.timer = setInterval(function ()
46			{
47				_this.doNext()	
48			}, 3000);	
49		}
50	},
51	doPrev : function ()
52	{
53		this.aSort.unshift(this.aSort.pop());
54		this.setUp()
55	},
56	doNext : function ()
57	{
58		this.aSort.push(this.aSort.shift());
59		this.setUp()
60	},
61	doImgClick : function ()
62	{
63		var _this = this;
64		for (var i = 0; i < this.aSort.length; i++)
65		{
66			this.aSort[i].onclick = function ()
67			{
68				if (this.index > _this.iCenter)
69				{
70					for (var i = 0; i < this.index - _this.iCenter; i++) _this.aSort.push(_this.aSort.shift());
71					_this.setUp()
72				}
73				else if(this.index < _this.iCenter)
74				{
75					for (var i = 0; i < _this.iCenter - this.index; i++) _this.aSort.unshift(_this.aSort.pop());
76					_this.setUp()
77				}
78			}
79		}
80	},
81	setUp : function ()
82	{
83		var _this = this;
84		var i = 0;
85		for (i = 0; i < this.aSort.length; i++) this.oUl.appendChild(this.aSort[i]);
86		for (i = 0; i < this.aSort.length; i++)
87		{
88			this.aSort[i].index = i;
89			if (i < 7)
90			{
91				this.css(this.aSort[i], "display", "block");
92				this.doMove(this.aSort[i], this.options[i], function ()
93				{
94					_this.doMove(_this.aSort[_this.iCenter].getElementsByTagName("img")[0], {opacity:100}, function ()
95					{
96						_this.doMove(_this.aSort[_this.iCenter].getElementsByTagName("img")[0], {opacity:100}, function ()
97						{
98							_this.aSort[_this.iCenter].onmouseover = function ()
99							{
100								_this.doMove(this.getElementsByTagName("div")[0], {bottom:0})
101							};
102							_this.aSort[_this.iCenter].onmouseout = function ()
103							{
104								_this.doMove(this.getElementsByTagName("div")[0], {bottom:-100})
105							}
106						})
107					})
108				});
109			}
110			else
111			{
112				this.css(this.aSort[i], "display", "none");
113				this.css(this.aSort[i], "width", 0);
114				this.css(this.aSort[i], "height", 0);
115				this.css(this.aSort[i], "top", 37);
116				//this.css(this.aSort[i], "left", this.oUl.offsetWidth / 2)
117			}
118			if (i < this.iCenter || i > this.iCenter)
119			{
120				this.css(this.aSort[i].getElementsByTagName("img")[0], "opacity", 30)
121				this.aSort[i].onmouseover = function ()
122				{
123					_this.doMove(this.getElementsByTagName("img")[0], {opacity:100})	
124				};
125				this.aSort[i].onmouseout = function ()
126				{
127					_this.doMove(this.getElementsByTagName("img")[0], {opacity:35})
128				};
129				this.aSort[i].onmouseout();
130			}
131			else
132			{
133				this.aSort[i].onmouseover = this.aSort[i].onmouseout = null
134			}
135		}		
136	},
137	addEvent : function (oElement, sEventType, fnHandler)
138	{
139		return oElement.addEventListener ? oElement.addEventListener(sEventType, fnHandler, false) : oElement.attachEvent("on" + sEventType, fnHandler)
140	},
141	css : function (oElement, attr, value)
142	{
143		if (arguments.length == 2)
144		{
145			return oElement.currentStyle ? oElement.currentStyle[attr] : getComputedStyle(oElement, null)[attr]
146		}
147		else if (arguments.length == 3)
148		{
149			switch (attr)
150			{
151				case "width":

152				case "height":
153				case "top":
154				case "left":
155				case "bottom":
156					oElement.style[attr] = value + "px";
157					break;
158				default :
159					oElement.style[attr] = value;
160					break
161			}	
162		}
163	},
164	doMove : function (oElement, oAttr, fnCallBack)
165	{
166		var _this = this;
167		clearInterval(oElement.timer);
168		oElement.timer = setInterval(function ()
169		{
170			var bStop = true;
171			for (var property in oAttr)
172			{
173				var iCur = parseFloat(_this.css(oElement, property));
174				property == "opacity" && (iCur = parseInt(iCur.toFixed(2) * 100));
175				var iSpeed = (oAttr[property] - iCur) / 5;
176				iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
177				
178				if (iCur != oAttr[property])
179				{
180					bStop = false;
181					_this.css(oElement, property, iCur + iSpeed)
182				}
183			}
184			if (bStop)
185			{
186				//clearInterval(oElement.timer);
187				fnCallBack && fnCallBack.apply(_this, arguments)	
188			}
189		}, 30)
190	}
191};
192window.onload = function ()
193{
194	new ZoomPic("box");
195};