- var curIndex=-1;
- var nextIndex=0;
- var timerId =0;
- var pImageWidth=0;
- var curImageLeft=0;
- var loopTimerId=0;
- function initImage(){
- var arrowWidth=32;
- var arrowHeight=56;
- var navWidth=20;
- var pw=$("#picContainter").width();
- var ph=$("#picContainter").height();
- var X = $("#picContainter").offset().left;
- var Y = $("#picContainter").offset().top;
- var picList=$('#listPicContent>img');
- var offsetX=X ;
- var offsetY=Y+(ph-arrowHeight)/2;
- $("#pic_0").attr("src",picList[0].src);
- $("#pic_1").attr("src", picList[1].src);
- $("#picArrowLeft").css("left",offsetX+"px");
- $("#picArrowLeft").css("top",offsetY+"px");
- offsetX=X+pw-arrowWidth-2 ;
- $("#picArrowRight").css("left",offsetX+"px");
- $("#picArrowRight").css("top",offsetY+"px");
- $("#picNavDivt").css("left",offsetX+"px");
- offsetY=Y+ph-navWidth;
- $("#picNavDiv").css("top",offsetY+"px");
- var size=picList.length;
- var navHtml="";
- var curClass=" ";
- for(var i=size;i>=1;i--){
- if(i==1){
- curClass=" class='over' ";
- }
- navHtml+="<li "+ curClass +" id='navPgage"+i+"'>"+(i)+"</li>";
- }
- $("#picNavDiv").html(navHtml);
- $('#picNavDiv>li').click(function(){
- $("#picNavDiv>li" ).removeClass("over");
- var index=parseInt(this.innerHTML);
- $("#navPgage"+index).addClass("over");
- curIndex=index-1;
- clearTimeout(loopTimerId);
- startScroll();
- loopTimerId=setTimeout("startMovePicLoop()",5000);
- });
- $("#picArrowLeft").hide();
- $("#picArrowRight").hide();
- $('#picContent>img').mouseenter(function(){
- $("#picArrowLeft").show();
- $("#picArrowRight").show();
- });
- $('#picContent>img').mouseout(function(){
- $("#picArrowLeft").hide();
- $("#picArrowRight").hide();
- });
- }
- function startScroll(){
- pImageWidth=$("#picContent").width()/2;
- var picList=$('#listPicContent>img');
- var size=picList.length;
- if(curIndex>size-1){
- curIndex=0;
- }
- nextIndex=curIndex+1;
- if(nextIndex>size-1){
- nextIndex=0;
- }
- if(timerId!=0){
- clearTimeout(timerId);
- }
- curImageLeft=0;
- $("#pic_0").attr("src",$("#pic_1").attr("src"));
- $("#pic_1").attr("src", picList[nextIndex].src);
- $("#pic_0").css("left","0px");
- $("#pic_1").css("left","0px");
- doScroll(0);
- $("#picNavDiv>li" ).removeClass("over");
- $("#navPgage"+(curIndex+1)).addClass("over");
- }
- function doScroll(dire){
- if(dire==0){
- curImageLeft-=20;
- var iLeft=-curImageLeft;
- if( iLeft>= pImageWidth){
- $("#pic_0").css("left",-pImageWidth+"px");
- $("#pic_1").css("left",-pImageWidth+"px");
- if(timerId!=0){
- clearTimeout(timerId);
- }
- timerId=0;
- }else{
- $("#pic_0").css("left",curImageLeft+"px");
- $("#pic_1").css("left",curImageLeft+"px");
- }
- }else{
- }
- timerId=setTimeout('doScroll('+dire+')',25);
- }
- function startMovePicLoop(){
- curIndex++;
- startScroll();
- loopTimerId=setTimeout("startMovePicLoop()",5000);
- }
- initImage();
- startMovePicLoop();
- aa.rar (517.3 KB)