js特效

 /*头部广告样式特效*/
   $("#Top img.close").click(function(){
		$("#Top").slideUp();
   });

 /*导航滑动效果   删除first last*/
   $("#Logo ul li.nav").hover(function(){
            var _left=$(this).position().left;
			var _width=$(this).width();
            $("#Logo ul li.last").show().css("width",_width).stop().animate({left:_left},200);
   },function(){  $("#Logo ul li.last").hide();
      //鼠标移开
   }); 
   
//吸顶盒导航 浏览器窗体滚动事件 scroll
   $(window).scroll(function(){
       var _top=$(window).scrollTop();//获取浏览器滚动高度
	   var _height=$("#TopMain").height();//获取盒子高度
	   if(_top>=_height){
	   
	      $("#Logo").addClass("gd");
		  $("#Logo ul li .Menu").css("display","none");
	   }
	   else{
	      $("#Logo").removeClass("gd");
		  $("#Logo ul li .Menu").css("display","block");
	   }
  })
  
  //左侧二级菜单内容
  $("#part1 .partCon .Menu ol li").hover(function(){
        $(this).addClass("hover");
        var _top=$(this).position().top;
		var _height=$(this).find(".moreNav").height()/3;
		if(_top>_height){
		    if($(this).index()==5){
			    
				$(this).find(".moreNav").css("top",-(_height*3-70));
			}
			else{
			$(this).find(".moreNav").css("top",-_height);
	        
			}	
		}
  },function(){
        $(this).removeClass("hover");
  });

  //首页轮播图特效
  var _index=0;
  var _qindex=0;
  var clearTime=null;
  var ktime=new Date();
  $(".But span").mouseover(function(){
        clearInterval(clearTime);
		_index=$(this).index();//获取序列号
		scrollPlay();
	
  }).mouseout(function(){
        autoPlay();
  });

  //右切换按钮
  $(".partCon .flash .flash_next").click(function(){
        var newtime=new Date();
	    if(newtime-ktime>300){
		_index++;
		if(_index>5){
		    _index=0;
			_qindex=5;
		}
		scrollPlay();
	      
	};	
        ktime=new Date();
  
  });

  //左切换按钮
  $(".partCon .flash .flash_prev").click(function(){
        var newtime=new Date();
	    if(newtime-ktime>300){
		_index--;
		if(_index<0){
		    _index=5;
			_qindex=0;
		}
		scrollPlay();
		
	}
        ktime=new Date();
        
  });

  //自动轮播
  autoPlay();
  function autoPlay(){
        clearTime=setInterval(function(){
		    _index++;
		    if(_index>5){
		    _index=0;
			_qindex=5;
		}
		    scrollPlay();
		
		},3000)
  
  }

  //清楚切换按钮定时器
  $("a.flash_next,a.flash_prev").hover(function(){
        clearInterval(clearTime);
  
  },function(){
	    autoPlay();
  
  });

  //封装滚动按钮
  function scrollPlay(){
        $(".But span").eq(_index).addClass("hover").siblings("span").removeClass("hover");
		
		if(_index==0&&_qindex==5){
		    $(".scroll img").eq(_qindex).animate({"left":"-820px"},300);
		    $(".scroll img").eq(_index).css("left","820px").animate({"left":"0px"},300);
		
		}
		else if(_index==5&&_qindex==0){
		    $(".scroll img").eq(_qindex).animate({"left":"820px"},300);
		    $(".scroll img").eq(_index).css("left","-820px").animate({"left":"0px"},300);
		
		}
		else if(_index>_qindex){//左移
	        $(".scroll img").eq(_qindex).animate({"left":"-820px"},300);
		    $(".scroll img").eq(_index).css("left","820px").animate({"left":"0px"},300);
		}
	    else if(_index<_qindex){//右移
		    $(".scroll img").eq(_qindex).animate({"left":"820px"},300);
		    $(".scroll img").eq(_index).css("left","-820px").animate({"left":"0px"},300);
		}
		_qindex=_index;
  
  }

  //滚动按钮的显示与隐藏
  $(".flash").hover(function(){
        
		//显示
        $("a.flash_prev,a.flash_next").show();
  
  },function(){
  
        //隐藏
		$("a.flash_prev,a.flash_next").hide();
  });
//限时抢购倒计时特效
  var endTime1=new Date();//结束时间
 //设置第一个礼品的结束时间
  endTime1.setFullYear(2017); //年
  endTime1.setMonth(12);//月
  endTime1.setDate(6);//天
  endTime1.setHours(12);//小时
  endTime1.setMinutes(10);//分钟
  endTime1.setSeconds(20);//秒
  
  var obj5=$("p.time1 font");
  var endTimes1=endTime1.getTime();
  changeTime(endTimes1,obj5);
  
  //设置定时器
  setInterval(function(){
        changeTime(endTimes1,obj5);
  },1000);


//封装倒计时特效
function changeTime(endTimes,obj){
  //剩余时间=结束时间-现在的时间
  var nowTime=new Date();//现在时间
  
  if(endTimes>nowTime.getTime()){
  //结束时间毫秒数-现在时间的毫秒数=相差时间毫秒数
  var s=(endTimes-nowTime.getTime())/1000;//相差时间毫秒数
  
  //把毫秒数化成 天 小时 分钟 秒
  var day=Math.floor(s/86400);//天数
      s=s%86400;//剩下的秒数
  var hours=Math.floor(s/3600);//小时
      s=s%3600;//剩下的秒数
  var minutes=Math.floor(s/60);//分钟
      s=Math.floor(s%60);//秒
  obj.eq(0).html(fullZero(day,2));
  obj.eq(1).html(fullZero(hours,2));
  obj.eq(2).html(fullZero(minutes,2));
  obj.eq(3).html(fullZero(s,2));
 }
 else{
  alert("时间小了");
 }
}
 
 //创建补0方法
 function fullZero(itime,n){
		var str=""+itime;
		while(str.length<n){
			str="0"+str;
	    }
			return str;
 }
/*商品详情选项卡效果*/
$("#ProductInfo ul.sel li").mouseover(function(){
	var _index=$(this).index();
	/*alert(_index);*/
    $(this).addClass("active").siblings("li").removeClass("active");
    $("#ProductInfo .productSelect .selcon").eq(_index).show().siblings().hide();
});

/*楼梯导航效果*/
$("#LoutiNav ul li").not("last").hover(function(){
    $(this).addClass("hover");
 
},function(){
    $(this).removeClass("hover");

});

var mark=2;
//导航点击事件
$("#LoutiNav ul li").not("last").click(function(){
     mark=1;
	$("#LoutiNav ul li").find("span").removeClass("active");
	$(this).find("span").addClass("active");
    //获取导航序列号
    var _index=$(this).index();
	//获取楼层高度
	var _top=$("#Main .Louti").eq(_index).offset().top;
	/*alert($("#LoutiNav ul li").size());*/
	if(_index!=$("#LoutiNav ul li").size()-1){
		$("body,html").animate({scrollTop:_top},500,function(){
			mark=2;
		});
	}
	else{
	    $("body,html").animate({scrollTop:0},1000);    
	
	}
});

//楼梯滚动事件
$(window).scroll(function(){
  var _t=$(this).scrollTop();
  
  if(_t>600){
    $("#LoutiNav").fadeIn();
  }
  else{
    $("#LoutiNav").hide();
  }
if(mark==2){
  var obj=$("#Main .Louti");
  obj.each(function(){
        var _index=$(this).index();
	    /*alert(_index);*/
		var _height=obj.eq(_index).offset().top+$(this).height()/2;
		/*document.title=_t+"--"+_height;*/
		if(_t<_height){
			$("#LoutiNav ul li").find("span").removeClass("active");
		    $("#LoutiNav ul li").eq(_index).find("span").addClass("active");
		    return false;
		}
    })
    }
});

/*用户购买时登录和注册页面*/
$("#LoginAndRegister .ti ul li").mouseover(function(){
	var _index=$(this).index();
    $(this).addClass("hover").siblings("li").removeClass("hover");
    $("#LoginAndRegister .LogReg div").eq(_index).show().siblings("div").hide();
})

//用户名
	$("input#user").keyup(function(){
		//用户名不能为空
		var txt=$(this).val();
		if(txt==""){
			$("label#l_user").css("color","red");
		}else{
			$("label#l_user").css("color","#666");
		}

		//当用户名不符合要求时
		/**用户名规则：
		   1、字母、数字、下划线组成，字母开头，4-16位。
		   2、 re = /^[0-9a-zA-Z]\w{3,15}$/;
		**/
		var re=/^[a-zA-Z]\w{3,15}$/;
		var bool=re.test(txt);
		if(!bool){
			$("label#l_user").css("color","red");
		}

	});

//邮箱验证
	$("input#email").keyup(function(){
		var txt=$(this).val();
		if(txt==""){
			$("label#l_email").css("color","red");
		}else{
			$("label#l_email").css("color","#666");
		}
		 /** 邮箱验证规则：
			 1、把邮箱地址分成“第一部分@第二部分”这样  xxx@qq.com
			 2、第一部分：由字母、数字、下划线、短线“-”、点号“.”组成，
			 3、第二部分：为一个域名，域名由字母、数字、短线“-”、域名后缀组成，
			 4、而域名后缀一般为.xxx或.xxx.xx，一区的域名后缀一般为2-4位字母，如cn,com,net，
		 myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,4}$/;
		 **/

		 var re=/^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,4}$/;
		 var bool=re.test(txt);
		 if(!bool){

			$("label#l_email").css("color","red");
		}
	});


	//密码
	$("input#pwd").keyup(function(){
		//密码不能为空
		var txt=$(this).val();
		if(txt==""){
			$("label#l_pwd").css("color","red");
			return;
		}else{
			$("label#l_pwd").css("color","#666");
		}

		//当用户名不符合要求时
		/**用户名规则：
		   1、字母、数字、下划线组成，字母开头，4-16位。
		   2、 re = /^[0-9a-zA-Z]\w{3,15}$/;
		**/
		var re=/^[0-9a-zA-Z]\w{3,15}$/;
		var bool=re.test(txt);
		if(!bool){
			$("label#l_pwd").css("color","red");
			return;
		}

	});
	
	//确认密码
	$("input#qrpwd").blur(function(){
		var txt2=$(this).val();
		var txt=$("input#pwd").val();
		if(txt!=txt2){

			$("label#l_qrpwd").css("color","red");
			return;
		}

	});

/*放大镜特效*/
$(".q_Img img").mouseover(function(){
    //鼠标滑动切换底部小图片    
	$(this).addClass("active").siblings().removeClass("active");
    //切换上部小图片
    var sImg=$(this).attr("dataSrc");
	$(".s_Img img").attr("src",sImg);
	$(".b_Img img").attr("src",sImg);
});

/*移到透明层上显示效果*/
$(".s_Img .shadow").hover(function(){
    $(".s_Img span.fk,.b_Img").show()

},function(){
    $(".s_Img span.fk,.b_Img").hide()
});

/*在透明层上移动效果*/
$(".s_Img .shadow").mousemove(function(e){
       //获取鼠标的位置
        var x=e.clientX;
        var y=e.clientY;
	
	//获取图片与屏幕左边和上边与屏幕的距离
	var t=$(this).offset().top-$(document).scrollTop();;
	var l=$(this).offset().left;
	//获取小方块的宽度和高度的一半
	var w=$(".s_Img span.fk").width()/2;
    var h=$(".s_Img span.fk").height()/2;

	//计算得到小方块与图片的top和left
	var _top=y-t-h;
    var _left=x-l-w;
   
    
	//能滑动的最大高度和宽度
	var bigW=$(".s_Img .shadow").width()-w*2;
	var bigH=$(".s_Img .shadow").height()-h*2


	if(_top<0){
	    _top=0;
	}
	else if(_top>bigH){
	    _top=bigH;
	}
	
	if(_left<0){
	    _left=0;
	}
	else if(_left>bigW){
	    _left=bigW;
	}
	
	//通过改变css动态改变小方块与图片的绝对位置
	$(".s_Img span.fk").css({"left":_left,"top":_top});
	
       //获取图片的移动比例
        var _l=_left/bigW;
	var _h=_top/bigH;
	//大图移动的距离
    var _bigL=($(".b_Img img").width()-$(".b_Img").width())*_l;
	var _bigT=($(".b_Img img").height()-$(".b_Img").height())*_h;
	/*document.title=_bigL+"--"+_bigT;*/
	//动态改变大图的绝对位置
	$(".b_Img img").css({"left":-_bigL,"top":-_bigT});
});