$(function () {
    var i = 0;
    var k = 5; //展示个数
    var scrollbox = $("#prospic_con>ul");
    var ubutton = $("#prosbtn_up")
    var dbutton = $("#prosbtn_dw");
    var liheight = $("#prospic_con>ul>li").height();
    var olist = $("#prospic_con>ul>li").length;
    var _up = 0;
    var g = 5;

    //下移动
    $(dbutton).click(function () {
		var i=$("#prospic_con>ul>li").find(".prospic_img").index($(".procur"))	
        
        if (i< olist-g)
          _up=-liheight*(i+1);
		else if(i==olist-1){
		  _up=0;
		  i=-1;
		}

        $(scrollbox).children("li").siblings("li").find(".prospic_img").removeclass("procur");
		$(scrollbox).children("li").eq(i+1).find(".prospic_img").addclass("procur");
		
        $(scrollbox).animate({
          top: _up
         }, "slow")
        //大小图切换
        settimeout(
		   function () {
			   $("#probpic").find("img").attr("src", $(scrollbox).children("li").eq(i+1).find("img").attr("src"));
			   $("#probpic").find("a").attr("href", $(scrollbox).children("li").eq(i+1).find("img").attr("src"));
		   }, 0);
    })

    //上移动
    $(ubutton).click(function () {
		var i=$("#prospic_con>ul>li").find(".prospic_img").index($(".procur"))	
		if (i==0){
		i=1
		}
        if (i> olist-g){}
		else{
         _up=-liheight*(i-1);	
		}

        $(scrollbox).children("li").siblings("li").find(".prospic_img").removeclass("procur");
		$(scrollbox).children("li").eq(i-1).find(".prospic_img").addclass("procur");

        $(scrollbox).animate({
          top: _up
         }, "slow")
       // 大小图切换
        settimeout(
         function () {
			   $("#probpic").find("img").attr("src", $(scrollbox).children("li").eq(i-1).find("img").attr("src"));
			   $("#probpic").find("a").attr("href", $(scrollbox).children("li").eq(i-1).find("img").attr("src"));			   
         }, 0);
    })
	
	//小图点击
	var myfirst = $("#prospic_con>ul>li").eq(0);
	$("#probpic").find("img").attr("src", myfirst.find("img").attr("src"));
	$("#probpic").find("a").attr("href", myfirst.find("img").attr("src"));
	$(myfirst).find(".prospic_img").addclass("procur");
	
	$("#prospic_con>ul").children("li").click(function () {
		$("#prospic_con>ul>li").find(".prospic_img").removeclass("procur");
		$(this).find(".prospic_img").addclass("procur");
	
		var obj = $(this);
		settimeout(
		   function () {
			   $("#probpic").find("img").attr("src", obj.find("img").attr("src"));
			   $("#probpic").find("a").attr("href", obj.find("img").attr("src"));
			   tsscrollresize();
		   }, 0
		);
	});
	tsscrollresize();
});



function tsscrollresize()
{
   var maxwidth=360;
   var maxheight=300;
	
   var myimg = document.getelementbyid("probpic").getelementsbytagname("img")[0];

	var imgnew = new image();
	imgnew.src = myimg.src;
	
	//将myimg存起来，相当于一个参数，不然异步的时候执行太快，一直是最后一张图
	imgnew.preimg=myimg;
				
			
	//这个是为了防遨游等浏览器，图片宽、高加为0执行
	if (imgnew.width == 0 || imgnew.height == 0) {
			imgnew.onload=function(){
				tsscrollresizehd(this,maxwidth,maxheight,this.preimg);
			};
	}
	else
	{
		tsscrollresizehd(imgnew,maxwidth,maxheight,myimg);
	}

}

function tsscrollresizehd(imgnew,maxwidth,maxheight,myimg)
{
	var hratio;
	var wratio;
	var ratio = 1;
	var w = imgnew.width;
	var h = imgnew.height;
	wratio = maxwidth / w;
	hratio = maxheight / h;
	if (maxwidth == 0 && maxheight == 0) {
		ratio = 1;
	} else if (maxwidth == 0) {
		if (hratio < 1) ratio = hratio;
	} else if (maxheight == 0) {
		if (wratio < 1) ratio = wratio;
	} else if (wratio < 1 || hratio < 1) {
		ratio = (wratio <= hratio ? wratio: hratio);
	}
	if (ratio < 1) {
		
		w = w * ratio;
		h = h * ratio;
	}
	
	if(h%2!=0)
	{
		h=h-1;
	}
	
	myimg.height = h;
	myimg.width = w;
	
	var tsimgsbox=document.getelementbyid("probpic").getelementsbytagname("img")[0];

	if(myimg.height<300)
	{
		var topbottom=(300-myimg.height)/2;
		tsimgsbox.style.paddingtop=topbottom+"px";
		tsimgsbox.style.paddingbottom=topbottom+"px";
	}
	else
	{
		tsimgsbox.style.paddingtop="0px";
		tsimgsbox.style.paddingbottom="0px";
	}
}