﻿
var shwid = 1;
function navStyle(temp) {
    shwid = temp;
    var obj = document.getElementById("nav" + temp);
    obj.className = "changeClassc";
    for (var i = 1; i < 7; i++) {
        if (i != temp) {
            document.getElementById("nav" + i).className = "changeClass";
        }

    }
}
var imgArr = new Array();
window.onload = function imgShow() {
navStyle(shwid);
    JitTravel.WebServer.IndexAoneShow.ShowImgUrl(showBigImg);
}
function showBigImg(imgUrl) {
    var showArr = new Array();
    var i;
    showArr = imgUrl.toString().split("]");
    for (i = 0; i < showArr.length; i++) {
        if (i == showArr.length - 1) {
            break;
        }
        else {
            imgArr.push(showArr[i]);
        }
    }
    if (imgArr.length != 0) {
        
        Scoll();
    }
}
var index = stopindex = 0, count;
var beauBeauSlide; //函数对象

function Scoll() {
var str, url;
    //实现动态加载图片及循环显示
$.each(imgArr, function(n, value) {                           //遍历要显示的图片
    var num = value.indexOf("+");
    str = value.substr(num + 1);
    url = value.substring(0, num);
    $("#pruductImage").append('<a href="' + str + '" id="' + n + '"><img src="../AdvertImages/' + url + '" alt="重庆旅游" /></a> ');
    $("#imageButton").append('<img class="icon" src="../image/cj_hy.gif" alt="重庆旅游" id=" ' + n + '"/>');
});
    count = $("#pruductImage a").length;  ////获取图片的总数
    $("#pruductImage a").hide();   //加载时，将所有图片都隐藏
    $("#pruductImage a:first-child").show();  //默认显示第一张
    autoScroll();    //自动滚动
    $("#imageButton img").hover(function() {    //当鼠标放到点上的时间则停止滚动
        stopScroll();   //停止自动滚动
        stopindex = $(this).attr("id");                              //获取所指向的点的ID
        index = stopindex.substring(stopindex.length - 1);             //截取最后一个字符
        $("#imageButton  img").attr("src", "../image/cj_hy.gif"); // 所有的点更改为灰色
        $("#imageButton img").eq(index).attr("src", "../image/cj_ly.gif"); //将所指向的点改为蓝色
        $("#pruductImage a").eq(index).fadeIn("slow");   //本身淡入显示
        $("#pruductImage a").eq(index).siblings().fadeOut("slow");    //其他的隐藏
    }, function() {
        stopindex = $(this).attr("id");    //获取所指向的点的ID
        index = stopindex.substring(stopindex.length - 1);             //截取最后一个字符
        autoScroll();  //自动滚动
    });

    $("#pruductImage a").hover(function() {    //当鼠标放到图片上的时间则停止滚动
        stopScroll();   //停止自动滚动
        stopindex = $(this).attr("id");                              //获取所指向的点的ID
        index = stopindex.substring(stopindex.length - 1);             //截取最后一个字符
        $("#imageButton  img").attr("src", "../image/cj_hy.gif"); // 所有的点更改为灰色
        $("#imageButton img").eq(index).attr("src", "../image/cj_ly.gif"); //将所指向的点改为蓝色
        $("#pruductImage a").eq(index).fadeIn("slow");   //本身淡入显示
        $("#pruductImage a").eq(index).siblings().fadeOut("slow");    //其他的隐藏
    }, function() {
        stopindex = $(this).attr("id");    //获取所指向的点的ID
        index = stopindex.substring(stopindex.length - 1);             //截取最后一个字符
        autoScroll();  //自动滚动
    });
}
//自动滚动函数
function autoScroll() {
    $("#pruductImage a").eq(index).fadeIn("slow");   //  序号等于index的图片显示
    $("#pruductImage a").eq(index - 1).fadeOut("slow");   //其他的隐藏
    $("#imageButton img").eq(index).attr("src", "../image/cj_ly.gif");   //序号等于index的点变为蓝色
    $("#imageButton img").eq(index).siblings().attr("src", "../image/cj_hy.gif"); //其他的点更改为灰色
    index++;     //index自增
    index = index >= count ? 0 : index;  //如果index大于图片总数，则返回从0开始继续滚动
    beauBeauSlide = setTimeout(autoScroll, 5000);   //间隔3秒自动滚动
}
function stopScroll()//当鼠标移动到对象上面的时候停止自动滚动
{
    clearTimeout(beauBeauSlide);
}
