var focusUtil = {
        absPosition: function(o, I) {
            var l = o.offsetLeft,
                O = o.offsetTop,
                i = o;
            while (i.id != document.body & i.id != document.documentElement & i != I) {
                i = i.offsetParent;
                l += i.offsetLeft;
                O += i.offsetTop
            };
            return {
                left: l,
                top: O
            }
        }
    };

    function FocusPic(FocusImgID, BigPicID, NumberID, TitleID, width, height) {
        this.Data = [];
        this.TimeOut = 5000;
        var isIE = navigator.appVersion.indexOf("MSIE") != -1 ? true : false;
        this.width = width;
        this.height = height;
        this.titleHeight = 25;
        this.selectedIndex = 0;
        var TimeOutObj;
        if (!FocusPic.childs) {
            FocusPic.childs = []
        };
        this.showTime = null;
        this.showSum = 10;
        this.ID = FocusPic.childs.push(this) - 1;
        this._listbg = null;
        this.listCode = '<span class="NumberItem" src="[$pic]" onclick="FocusPic.childs[[$thisId]].select([$num])">[$numtoShow]</span>';
        this.Add = function(jsnObj) {
            if (jsnObj) {
                this.Data.push(jsnObj)
            }
        };
        this.TimeOutBegin = function() {
            clearInterval(TimeOutObj);
            TimeOutObj = setInterval("FocusPic.childs[" + this.ID + "].next()", this.TimeOut)
        };
        this.TimeOutEnd = function() {
            clearInterval(TimeOutObj)
        };
        this.select = function(num, noAction) {
            if (num > this.Data.length - 1) {
                return
            };
            if (num == this.selectedIndex) {
                return
            };
            this.TimeOutBegin();
            if (BigPicID) {
                if (this.$(BigPicID)) {
                    var aObj = this.$(BigPicID).getElementsByTagName("a")[0];
                    aObj.href = this.Data[num].url;
                    if (this.aImgY) {
                        this.aImgY.style.display = 'none';
                        this.aImg.style.zIndex = 0
                    };
                    this.aImgY = this.$('F' + this.ID + 'BF' + this.selectedIndex);
                    this.aImg = this.$('F' + this.ID + 'BF' + num);
                    clearTimeout(this.showTime);
                    this.showSum = 5;
                    if (!noAction) {
                        var appleMobileCheck = /\((iPad|iPhone|iPod)/i;
                        if (appleMobileCheck.test(navigator.userAgent)) {
                            if (this.aImgY) {
                                this.aImgY.style.display = 'none'
                            };
                            this.aImg.style.display = 'block';
                            this.aImg.style.zIndex = 0;
                            this.aImg.style.opacity = 1;
                            this.aImgY = null
                        } else {
                            this.showTime = setTimeout("FocusPic.childs[" + this.ID + "].show()", 30)
                        }
                    } else {
                        if (isIE) {
                            this.aImg.style.filter = "alpha(opacity=100)"
                        } else {
                            this.aImg.style.opacity = 1
                        }
                    }
                }
            };
            if (TitleID) {
                if (this.$(TitleID)) {
                    this.$(TitleID).innerHTML = "<a href=\"" + this.Data[num].url + "\" target=\"_blank\">" + this.Data[num].title + "</a>"
                }
            };
            if (NumberID) {
                if (this.$(NumberID) && FocusImgID && this.$(FocusImgID)) {
                    var sImg = this.$(NumberID).getElementsByTagName("span"),
                        i;
                    for (i = 0; i < sImg.length; i++) {
                        if (i == num || num == (i - this.Data.length)) {
                            sImg[i].className = "NumberItemOn";
                            if (this._listbg) {
                                this._listbg.style.right = 1 + (sImg.length - i - 1) * (16 + 2) + "px"
                            } else {
                                this._listbg = document.createElement("div");
                                if (this._listbg) {
                                    this._listbg.className = "NumberItemBg";
                                    this._listbg.style.bottom = this.titleHeight + "px";
                                    this.$(FocusImgID).appendChild(this._listbg)
                                }
                            }
                        } else {
                            sImg[i].className = "NumberItem"
                        }
                    }
                }
            };
            this.selectedIndex = num;
            if (this.onchange) {
                this.onchange()
            }
        };
        this.show = function() {
            this.showSum--;
            if (this.aImgY) {
                this.aImgY.style.display = 'block'
            };
            this.aImg.style.display = 'block';
            if (isIE) {
                this.aImg.style.filter = "alpha(opacity=0)";
                this.aImg.style.filter = "alpha(opacity=" + (10 - this.showSum) * 10 + ")"
            } else {
                this.aImg.style.opacity = 0;
                this.aImg.style.opacity = (10 - this.showSum) * 0.1
            };
            if (this.showSum <= 0) {
                if (this.aImgY) {
                    this.aImgY.style.display = 'none'
                };
                this.aImg.style.zIndex = 0;
                this.aImgY = null
            } else {
                this.aImg.style.zIndex = 2;
                this.showTime = setTimeout("FocusPic.childs[" + this.ID + "].show()", 30)
            }
        };
        this.next = function() {
            var temp = this.selectedIndex;
            temp++;
            if (temp >= this.Data.length) {
                temp = 0
            };
            this.select(temp)
        };
        this.pre = function() {
            var temp = this.selectedIndex;
            temp--;
            if (temp < 0) {
                temp = this.Data.length - 1
            };
            this.select(temp)
        };
        this.begin = function() {
            this.selectedIndex = -1;
            var i, temp = "";
            if (FocusImgID) {
                if (this.$(FocusImgID)) {
                    var topObj = this.$(FocusImgID);
                    topObj.style.width = this.width + "px";
                    topObj.style.height = this.height + "px"
                }
            };
            if (TitleID) {
                if (this.$(TitleID)) {
                    this.$(TitleID).style.width = this.width + "px";
                    if (this.titleHeight <= 0) {
                        this.titleHeight = 0
                    };
                    this.$(TitleID).style.height = this.titleHeight + "px";
                    this.$(TitleID).style.lineHeight = this.titleHeight + "px";
                    var _titlebg = document.createElement("div");
                    if (_titlebg) {
                        _titlebg.className = "TitileBg";
                        _titlebg.style.width = this.width + "px";
                        _titlebg.style.height = this.titleHeight + "px";
                        if (FocusImgID && this.$(FocusImgID)) {
                            this.$(FocusImgID).appendChild(_titlebg)
                        }
                    }
                }
            };
            if (BigPicID) {
                if (this.$(BigPicID)) {
                    var aObj = this.$(BigPicID).getElementsByTagName("a")[0];
                    aObj.style.zoom = 1;
                    this.$(BigPicID).style.height = this.height + "px";
                    for (i = 0; i < this.Data.length; i++) {
                        temp += '<img src="' + this.Data[i].pic + '" id="F' + this.ID + 'BF' + i + '" style="display:' + (i == 0 ? 'block' : 'none') + '" galleryimg="no"' + (this.width ? ' width="' + this.width + '"' : '') + (this.height ? ' height="' + this.height + '"' : '') + ' alt="' + this.Data[i].title + '" />'
                    };
                    aObj.innerHTML = temp;
                    var imgObjs = aObj.getElementsByTagName("img"),
                        XY = focusUtil.absPosition(imgObjs[0], this.$(BigPicID));
                    for (i = 0; i < imgObjs.length; i++) {
                        imgObjs[i].style.position = "absolute";
                        imgObjs[i].style.top = XY.top + "px";
                        imgObjs[i].style.left = XY.left + "px";
                        imgObjs[i].style.width = this.width + "px";
                        imgObjs[i].style.height = this.height + "px"
                    }
                }
            };
            if (NumberID) {
                if (this.$(NumberID)) {
                    tempHTML = "";
                    for (i = 0; i < this.Data.length; i++) {
                        temp = this.listCode;
                        temp = temp.replace(/\[\$thisId\]/ig, this.ID);
                        temp = temp.replace(/\[\$num\]/ig, i);
                        temp = temp.replace(/\[\$numtoShow\]/ig, i + 1);
                        temp = temp.replace(/\[\$title\]/ig, this.Data[i].title);
                        tempHTML += temp
                    };
                    this.$(NumberID).innerHTML = tempHTML;
                    this.$(NumberID).style.bottom = this.titleHeight + 2 + "px";
                    var sImg = this.$(NumberID).getElementsByTagName("span"),
                        i;
                    this._listbg = document.createElement("div");
                    if (this._listbg) {
                        this._listbg.className = "NumberItemBg";
                        this._listbg.style.bottom = this.titleHeight + "px";
                        this.$(FocusImgID).appendChild(this._listbg)
                    }
                }
            };
            this.TimeOutBegin();
            this.select(0, true)
        };
        this.$ = function(objName) {
            if (document.getElementById) {
                return eval('document.getElementById("' + objName + '")')
            } else {
                return eval('document.all.' + objName)
            }
        }
    };
		


$(document).ready(function(){
var FocusPic_02 = new FocusPic("FocusImg_2","BigPic_2","Number_2" ,"TitleBox_2", 380, 260);
FocusPic_02.TimeOut = 5000;
FocusPic_02.autoPlay = false;
FocusPic_02.htmlData = document.getElementById('focusData_01').getElementsByTagName('dl');
for(var i=0;i<FocusPic_02.htmlData.length;i++){
	var jsonData = {
		title : FocusPic_02.htmlData[i].getElementsByTagName('a')[0].innerHTML,
		url : FocusPic_02.htmlData[i].getElementsByTagName('a')[0].href,
		pic : FocusPic_02.htmlData[i].getElementsByTagName('dd')[0].innerText || FocusPic_02.htmlData[i].getElementsByTagName('dd')[0].textContent
	};
	FocusPic_02.Add(jsonData);
};
FocusPic_02.begin();
})