﻿// JScript File

//var adNum=Math.round(Math.random() * 4);    
var adNum=5;
var theTimer = 2;
/* 
    切换指定的Banner图片 & Banner按钮
*/
function buttonBanner(index)
{
    var bannersTag = document.getElementById("smallButtons").getElementsByTagName("li");
    var bannersPhoto = document.getElementById("bannerPhoto").getElementsByTagName("li"); 
    
    // 如果传入的参数大于总按钮数，则将参数的值赋为总按钮数
    if(index > bannersTag.length-1)
    {
        index = bannersTag.length-1;
    }    
    // 遍历所有Banner小按钮，将样式清除
    for(var btnIndex = 0; btnIndex < bannersTag.length; btnIndex++)
    {
        bannersTag[btnIndex].className ="";
    }  
    // 隐藏Banner图片
    for(var photoIndex = 0; photoIndex < bannersPhoto.length; photoIndex++)
    {
        bannersPhoto[photoIndex].style.display = "none";
    }
    // 显示当前Banner图片
    bannersPhoto[index].style.display = "block";    
    // 为当前选中的banner,对应设置小按钮样式
    bannersTag[index].className = "current";   
}

/* 
    轮换Banner图片 & Banner按钮
*/
function nextAd(adNum)
{
    var bannersPhoto = document.getElementById("bannerPhoto").getElementsByTagName("li"); 
    if(adNum<bannersPhoto.length-1)adNum++ ; 
    else adNum=0; 
    
    //切换Banner图片 & Banner按钮
    buttonBanner(adNum);
        
    //定义了轮换时间 5s
    if(adNum!=0)
    theTimer=setTimeout("nextAd("+adNum+")", 5000);  
    else
    theTimer=setTimeout("nextAd("+adNum+")", 5000); 
} 


/*
    当鼠标悬停在Banner小按钮上时所触发的事件
*/
function overButton(index)
{   
    clearTimeout(theTimer);
    buttonBanner(index);
}

/* 
    鼠标悬停在整个Banner区域时所触发的事件:   
*/
function overBanner()
{
    var bannersTag = document.getElementById("smallButtons").getElementsByTagName("li");
    for(var btnIndex = 0; btnIndex < bannersTag.length; btnIndex++)
    {
        if(bannersTag[btnIndex].className == "current")
        {
            adNum = btnIndex;
        }
    }
    overButton(adNum);
}

/*
 鼠标移出整个banner区域时所触发的事件：
 当鼠标移出整个Banner区域时，再对Banner实现自动轮换的效果。
 (避免鼠标移出小按钮时,因为Banner自动切换，导致不能点击当前Banner图片链接的情况)
*/
function outBanner()
{
    var bannersTag = document.getElementById("smallButtons").getElementsByTagName("li");
    for(var btnIndex = 0; btnIndex < bannersTag.length; btnIndex++)
    {
        if(bannersTag[btnIndex].className == "current")
        {
            adNum = btnIndex-1;
        }
    }
    nextAd(adNum);
}