var picPlayer = function (imageWrapper, imageBox, miniImageWrapper, miniImageBox, flagClass) {
    this.currentImage = 0; //当前的状态[也被赋值给改变后的状态] 0表示当前显示的是第1大图和第1小图，其他的隐藏或者半透明
    this.beforeImage = null; //变化前的状态
    this.ieOpacity1 = 0; //for IE
    this.ieOpacity2 = 100;
    this.currentPasuse = null;
    this.currentTimeout = null; //setTimeout
    this.currentInterval = null; //setTimeout	setTimeout还是递归调用好用啊

    this.images = document.getElementById(imageWrapper).getElementsByTagName(imageBox);
    this.miniImages = document.getElementById(miniImageWrapper).getElementsByTagName(miniImageBox);
    //this.explain=document.getElementById(explainWrapper).getElementsByTagName(explainBox);
    this.maxImagesNumber = this.miniImages.length; //图片最大数量
    this.flagClass = flagClass;
};

picPlayer.prototype.current = function ()	//当前的状态
{
    for (var i = 0; i < this.maxImagesNumber; i++)	//当前的小图片的状态
    {
        //imageBox.style.filter="alpha(opacity="+inteval+")";
        this.miniImages[this.currentImage].className = this.flagClass;
        //this.explain[this.currentImage].style.display="block";		
        if (i != this.currentImage) {
            this.miniImages[i].className = "";
            //this.explain[i].style.display="none";		
        }
    }

    for (var i = 0; i < this.maxImagesNumber; i++)	//当前的大图片的状态
    {
        this.images[this.currentImage].style.opacity = 1.0;
        this.images[this.currentImage].style.filter = "alpha(opacity=" + 100 + ")"; //IE
        this.images[this.currentImage].style.zIndex = 99;
        if (i != this.currentImage) {
            this.images[i].style.opacity = 0.0;
            this.images[i].style.filter = "alpha(opacity=" + 0 + ")";
            this.images[i].style.zIndex = "";
        }
    }
};

picPlayer.prototype.pasuse = function (time) {
    var self = this;
    this.currentPasuse = setTimeout(function () {
        self.timeout(time);
    }, time);
};

picPlayer.prototype.timeout = function (time)	//小图片改变,大图片改变
{
    var self = this;
    this.beforeImage = this.currentImage; //把变化前的状态保存起来
    this.currentImage++; //跳到下一个图
    this.currentImage = this.currentImage < this.maxImagesNumber ? this.currentImage : 0;
    this.currentTimeout = setTimeout(function () { self.interval(); }, time);
};

picPlayer.prototype.interval = function ()	//渐变的转化，以及下面小图片的切换
{
    if (null == this.images[this.currentImage])
        return;
    if (this.images[this.currentImage].style.opacity == 1.0 || this.ieOpacity1 == 100) {
        clearTimeout(this.currentInterval);
        //复位
        this.ieOpacity1 = 0;
        this.ieOpacity2 = 100;

        //小图改变,大图zIndex值的改变
        for (var i = 0; i < this.maxImagesNumber; i++) {
            this.miniImages[this.currentImage].className = this.flagClass;
            //this.explain[this.currentImage].style.display="block";
            this.images[this.currentImage].style.zIndex = 99;

            if (i != this.currentImage) {
                this.miniImages[i].className = "";
                this.images[i].style.zIndex = "";
            }
        }
        //继续等待触发
        this.timeout(10000);
        return;
    }
    var self = this;
    this.images[this.currentImage].style.opacity = parseFloat(this.images[this.currentImage].style.opacity) + 0.1; //需要显示的逐渐出现
    //for IE
    this.ieOpacity1 += 10;
    this.images[this.currentImage].style.filter = "alpha(opacity=" + this.ieOpacity1 + ")";

    this.images[this.beforeImage].style.opacity = parseFloat(this.images[this.beforeImage].style.opacity) - 0.1; //需要隐藏的逐渐消失
    //for IE
    this.ieOpacity2 -= 10;
    this.images[this.beforeImage].style.filter = "alpha(opacity=" + this.ieOpacity2 + ")";

    this.currentInterval = setTimeout(function () { self.interval(); }, 50);
};

picPlayer.prototype.myMouse = function () {

    var self = this;
    for (var i = 0; i < this.maxImagesNumber; i++) {
        this.miniImages[i].onmouseover = function () {
            clearTimeout(self.currentPasuse);
            clearTimeout(self.currentTimeout);

            self.currentImage = parseInt(this.name) - 1; //èŽ·å–é¼ æ ‡é€‰åˆ°çš„å›¾ç‰‡çš„å€¼
            self.current();
        }
        this.miniImages[i].onmouseout = function () {
            self.pasuse(1000);
        }
    }
}