function zoompic ()
{
	this.initialize.apply(this, arguments)
}
zoompic.prototype =
{
    initialize: function (id, options) {
        var _this = this;

        this.wrap = typeof id === "string" ? document.getelementbyid(id) : id;
        this.oul = this.wrap.getelementsbytagname("ul")[0];
        this.ali = this.wrap.getelementsbytagname("li");
        this.prev = this.wrap.getelementsbytagname("span")[0];
        this.next = this.wrap.getelementsbytagname("span")[1];
        this.timer = 1000;
        this.asort = [];
        this.icenter = 2;
        this._doprev = function () { return _this.doprev.apply(_this) };
        this._donext = function () { return _this.donext.apply(_this) };
        this.options = [
       {width:355, height:260, top:40, left:0, zindex:1},
       {width:395, height:290, top:20, left:70, zindex:2},
       {width:435, height:318, top:0, left:140, zindex:3},
       {width:395, height:290, top:20, left:250, zindex:2},
       {width:355, height:260, top:40, left:355, zindex:1},
// 			{width: 415, height: 285, top: 40, left: 0, zindex: 1 },
// 			{ width: 455, height: 325, top: 20, left: 75, zindex: 2 },
// 			{ width: 495, height: 365, top: 0, left: 150, zindex: 3 },
// 			{ width: 455, height: 325, top: 20, left: 265, zindex: 2 },
// 			{ width: 416, height: 285, top: 40, left: 380, zindex: 1 },

  
		];
        
        if (options) {
            this.options = options;
        }
        
        for (var i = 0; i < this.ali.length; i++) this.asort[i] = this.ali[i];
        this.asort.unshift(this.asort.pop());
        this.setup();
        this.addevent(this.prev, "click", this._doprev);
        this.addevent(this.next, "click", this._donext);
        this.doimgclick();
        this.timer = setinterval(function () {
            _this.donext()
        }, 3000);
        this.wrap.onmouseover = function () {
            clearinterval(_this.timer)
        };
        this.wrap.onmouseout = function () {
            _this.timer = setinterval(function () {
                _this.donext()
            }, 3000);
        }
    },
    doprev: function () {
        this.asort.unshift(this.asort.pop());
        this.setup()
    },
    donext: function () {
        this.asort.push(this.asort.shift());
        this.setup()
    },
    doimgclick: function () {
        var _this = this;
        for (var i = 0; i < this.asort.length; i++) {
            this.asort[i].onclick = function () {
                if (this.index > _this.icenter) {
                    for (var i = 0; i < this.index - _this.icenter; i++) _this.asort.push(_this.asort.shift());
                    _this.setup()

                }
                else if (this.index < _this.icenter) {
                    for (var i = 0; i < _this.icenter - this.index; i++) _this.asort.unshift(_this.asort.pop());
                    _this.setup()
                }
            }
        }
    },
    setup: function () {
        var _this = this;
        var i = 0;
        for (i = 0; i < this.asort.length; i++) this.oul.appendchild(this.asort[i]);
        for (i = 0; i < this.asort.length; i++) {
            this.asort[i].index = i;
            if (i < 5) {
                this.css(this.asort[i], "display", "block");
                this.domove(this.asort[i], this.options[i], function () {
                    _this.domove(_this.asort[_this.icenter].getelementsbytagname("img")[0], { opacity: 100 }, function () {
                        _this.domove(_this.asort[_this.icenter].getelementsbytagname("img")[0], { opacity: 100 }, function () {
                            _this.asort[_this.icenter].onmouseover = function () {
                                _this.domove(this.getelementsbytagname("div")[0], { bottom: 0 })
                            };
                            _this.asort[_this.icenter].onmouseout = function () {
                                _this.domove(this.getelementsbytagname("div")[0], { bottom: -100 })
                            }
                        })
                    })
                });
            }
            else {
                this.css(this.asort[i], "display", "none");
                this.css(this.asort[i], "width", 0);
                this.css(this.asort[i], "height", 0);
                this.css(this.asort[i], "top", 37);
                this.css(this.asort[i], "left", this.oul.offsetwidth / 2)
            }
            if (i < this.icenter || i > this.icenter) {
                this.css(this.asort[i].getelementsbytagname("img")[0], "opacity", 100)
                this.asort[i].onmouseover = function () {
                    _this.domove(this.getelementsbytagname("img")[0], { opacity: 100 })
                };
                this.asort[i].onmouseout = function () {
                    _this.domove(this.getelementsbytagname("img")[0], { opacity: 100 })
                };
                this.asort[i].onmouseout();
            }
            else {
                this.asort[i].onmouseover = this.asort[i].onmouseout = null
            }
        }
    },
    addevent: function (oelement, seventtype, fnhandler) {
        return oelement.addeventlistener ? oelement.addeventlistener(seventtype, fnhandler, false) : oelement.attachevent("on" + seventtype, fnhandler)
    },
    css: function (oelement, attr, value) {
        
        if (!oelement) {
            return
        }
        
        if (arguments.length == 2) {
            return oelement.currentstyle ? oelement.currentstyle[attr] : getcomputedstyle(oelement, null)[attr]
        }
        else if (arguments.length == 3) {
            switch (attr) {
                case "width":
                case "height":
                case "top":
                case "left":
                case "bottom":
                    oelement.style[attr] = value + "px";
                    break;
                case "opacity":
                    oelement.style.filter = "alpha(opacity=" + value + ")";
                    oelement.style.opacity = value / 100;
                    break;
                default:
                    oelement.style[attr] = value;
                    break
            }
        }
    },
    domove: function (oelement, oattr, fncallback) {
        var _this = this;
        if (oelement) {
            oelement.timer && clearinterval(oelement.timer);
    
            oelement.timer = setinterval(function () {
                var bstop = true;
                for (var property in oattr) {
                    var icur = parsefloat(_this.css(oelement, property));
                    property == "opacity" && (icur = parseint(icur.tofixed(2) * 100));
                    var ispeed = (oattr[property] - icur) / 5;
                    ispeed = ispeed > 0 ? math.ceil(ispeed) : math.floor(ispeed);
            
                    if (icur != oattr[property]) {
                        bstop = false;
                        _this.css(oelement, property, icur + ispeed)
                    }
                }
                if (bstop) {
                    clearinterval(oelement.timer);
                    fncallback && fncallback.apply(_this, arguments)
                }
            }, 30)
        }
    }
};