轮播器

$(function () {



//浏览器检测,判断是否是IE
	if(!+[1,])
	{
		//alert("这是ie浏览器");   
		$('.new_Message').css('top', '14px');	//调整通知栏的位置
		$('.stuUser').click(function () {
			if ($('.stuUser_ul ').css('display') == 'none')
			{
				$('.stuUser_ul ').css('display', 'block');
			}
			else
			{
				$('.stuUser_ul ').css('display', 'none');
			}
		});

	}
　　 else {
		//alert("这不是ie浏览器");
		$('.stuUser').hover(function () {
				$('.stuUser_ul ').css('background', '#0E78E7');
				$('.stuUser_ul ').css('display', 'block');
		}, function () {
			
			$('.stuUser_ul ').css('background', '#0D5AA5');
			$('.stuUser_ul ').css('display', 'none');
		});

	}

	

	$('.navigationStyle').hover(
		function(){
			var aTag = $(this).children('img');
			var src = $(aTag).attr("src");
			src = src.slice(0, src.length - 4);
			src += '1.jpg';
			//alert(src);
			$(aTag).attr("src", src);
		},
		function(){
			var aTag = $(this).children('img');
			var src = $(aTag).attr("src");
			src = src.slice(0, src.length - 5);
			src += '.jpg';
			//alert(src);
			$(aTag).attr("src", src);
	});


        //左侧选项卡
	$("#img1").click(function(){
		$('.showScreen .tab').hide();
		$('#showScreenTab1').stop(true, true).slideToggle();
	});

	$('#img2').click(function () {
		$('#showCourse').hide();
		$('.showClass').show();
		$('.showScreen .tab').hide();
		$('#showScreenTab2').stop(true, true).slideToggle();
		$('#info_left').hide();		//让导航复原
		$('#info_right').show();
		initShowImgRotatorCss();	//让5个小图复原
	});

	$('#img3').click(function () {
		$('.showScreen .tab').hide();
		$('#showScreenTab3').stop(true,true).slideToggle();
	});

	$('#img4').click(function () {
		$('.showScreen .tab').hide();
		$('#showScreenTab4').stop(true,true).slideToggle();
	});

	$('#img5').click(function () {
		$('.showScreen .tab').hide();
		$('#showScreenTab5').stop(true,true).slideToggle();
	});



	var item = $('.showClassImg');
	for (i = 0; i < item.length; i++) {
		item.eq(i).on("click", { number:(i + 1) }, picClick);
	};

	//相应点击课程事件
	function picClick(num)
	{	
		$('#showCourse').show();
		$('.showClass').hide();
		// <img class="showScreenTab1_img" i="" src="/hgonlywj/Public/Index/img/home_img.jpg">
		var imgSrc = '/hgonlywj/Public/Index/img/class_img/class'+ num.data.number;

		$('#imgShow').attr('src', imgSrc + '/1.jpg');
		//alert(imgSrc);
		var pptNum = 0;				　　　　    //初始化显示 为0
		initShowImgRotator(imgSrc, pptNum);		　 //初始化轮播图片
		initRotatorClick(imgSrc);		　　　　　　//初始化轮播器事件

	}
	
	//初始化滚动的课程小图, pptNum是开始显示ppt的位置
	function initShowImgRotator(imgSrc, pptNum) {
		for (var i = 1 + pptNum; i <= 5 + pptNum; i++) {
			// num = $('.rotatorImg' + i).attr('src');
			$('.rotatorImg' + (i - pptNum)).attr('src', imgSrc + '/loop_img/' + i + ".png");	//初始化轮播器的图片
			$('.lableImg' + (i - pptNum)).text(i);		//设置初始化的图片下面标号

		}
	}

	//将点击的小图显示成为中心的大图,添加事件
	function initRotatorClick (imgSrc) {
		//alert(img.data.src + img.data.nummber + ".png");
		imgSrc += "/show_img/";

		for (var i = 1; i <=5 ; i++) {
			// num = $('.rotatorImg' + i).attr('src');
			$('.rotatorImg' + i).on("click", { src:(imgSrc) , nummber:(i) }, function(img) {
				var imgdir = $('.rotatorImg' + img.data.nummber).attr('src');
				var location = imgdir.lastIndexOf("/");
				var img_num = parseInt(imgdir.slice(location + 1));		//获取点击轮播器上面图片的数字
				$('#imgShow').attr('src', img.data.src  + img_num + ".jpg");
				initShowImgRotatorCss();
				imgLightShow(img.data.nummber);			//让点击的那个高亮
			});
		}
	}


	function infoLeftOrRightAjax(rotatorImg, funName)
	{
		var courseSrc = $(rotatorImg).attr('src');
		var courseSrcNum = parseInt(courseSrc.slice(courseSrc.lastIndexOf("class") + 5));	//获取课程编号
		var pptShowNum = parseInt(courseSrc.slice(courseSrc.lastIndexOf("/") + 1));			//获取轮播器中第五个 PPT的编号.
		var showImgSrc = courseSrc.slice(0, courseSrc.lastIndexOf("class") + 6);
		//alert(showImgSrc);

		$.ajax({
				type : 'post',
				url : URL + "/" + funName,
				data : {
					courseSrcNum: courseSrcNum,
					pptShowNum: pptShowNum
				},
				success : function (stat) {
					// document.location.href= URL;		//刷新子页面
					//alert(stat);
					var imgBegin = parseInt(stat);
					if (imgBegin < 0)
						imgBegin = 1;
					initShowImgRotator(showImgSrc, imgBegin);		//改变展示的小图
					isLightShow();
					$('#info_left').show();
					$('#info_right').show();
				
					if ('leftRoll' == funName) {
						if (false == stat.slice(stat.lastIndexOf("/") + 1))		//如果返回0, 就到了第一张.左面的导航去掉
						{
							$('#info_left').hide();
						}

					}
					else if ('rightRoll' == funName)
					{
						if (false == stat.slice(stat.lastIndexOf("/") + 1))		//如果返回0, 就到了最后一张.右面的导航去掉
						{
							$('#info_right').hide();			
						}

					}

				},
		});
	}

	//初始化小图样式,  复原
	function initShowImgRotatorCss() {
		// alert('initShowImgRotatorCss');
		
		for (var i = 1 ; i <= 5; i++) {
			if ($('.rotatorImg' + i).css('width') == '132px')
			{
				var imgLable = '.rotatorImg' + i;
				// $(imgLable).css('width', 100).css('height', 80).css('left', parseInt($(imgLable).css('left')) + 13).css('top', parseInt($(imgLable).css('top')) + 12).css('z-index', 0);
				$(imgLable).css('width', 100).css('height', 80).css('margin', '0px').css('z-index', 0);	
				$('.lableImg' + i).show();		//设置初始化的图片下面标号
			}
		}
	}

	//让小图高亮
	function imgLightShow(lightNum)
	{
		var imgLable = '.rotatorImg' + lightNum;
		$(imgLable).css('width', 132).css('height', 102).css('z-index', 1);
		$(imgLable).css('margin', "-7px 0 0 -13px ");

		$('.lableImg' + lightNum).hide();
		//alert(lightNum);
	}

	//判断当前图片是否在轮播器中
	function isLightShow()
	{
		var showsrc = $('#imgShow').attr('src');
		var pptShowNum = parseInt(showsrc.slice(showsrc.lastIndexOf("/") + 1));			//正在显示的图片ppt编号
		var leftNum = $('.lableImg1 ').text();
		//var pptleft = parseInt(leftsrc.slice(leftsrc.lastIndexOf("/") + 1));			//轮播器第一个
		var rightNum = $('.lableImg5').text();
		//var pptright = parseInt(rightsrc.slice(rightsrc.lastIndexOf("/") + 1));		//轮播器最后一个

		// alert('正在显示 ppt' + pptShowNum);
		// alert('第一个 left ' + leftNum);
		// alert('第一个 right' + rightNum);

		if (pptShowNum >= leftNum && pptShowNum <= rightNum)		//当前显示的图片在轮播器中
		{
			// alert(pptShowNum + "在当前轮播器中");
			imgLightShow(pptShowNum - leftNum + 1);			//让他高亮
		}
		else if (pptShowNum < leftNum || pptShowNum > rightNum)		//当前显示的图片不在轮播器中,5个图片就显示正常
		{
			initShowImgRotatorCss();			
		}
	}

	//左轮播
	$('#info_left').click(function () {
		$('#info_right').show();
		// alert($('.rotatorImg1').attr('src'));
		initShowImgRotatorCss();
		infoLeftOrRightAjax('.rotatorImg1', "leftRoll");
	});

	//右轮播
	$('#info_right').click(function () {
		$('#info_left').show();
		initShowImgRotatorCss();
		infoLeftOrRightAjax('.rotatorImg5', "rightRoll");
	});


	function imgProOrNext (rotatorImg, funName) {
		var courseSrc = $(rotatorImg).attr('src');
		var courseSrcNum = parseInt(courseSrc.slice(courseSrc.lastIndexOf("class") + 5));	//获取课程编号
		var pptShowNum = parseInt(courseSrc.slice(courseSrc.lastIndexOf("/") + 1));			//获取轮播器中第五个 PPT的编号.
		var showImgSrc = courseSrc.slice(0, courseSrc.lastIndexOf("class") + 6);			//地址到  Public/Index/img/class_img/class1 的路径
		//alert(showImgSrc);

		$.ajax({
				type : 'post',
				url : URL + "/" + funName,
				data : {
					courseSrcNum: courseSrcNum,
					pptShowNum: pptShowNum
				},
				success : function (stat) {
					var imgShowNum = parseInt(stat);
					
					// initShowImgRotator(showImgSrc, imgBegin);		//改变展示的小图

					if ('showLeftImg' == funName)
					{
	
						if (false == stat.slice(stat.lastIndexOf("/") + 1))		//如果返回0, 就到了第一张.左面的导航去掉
						{
							$('#info_left').hide();
						}
						else {													//不是第一张就改变大图,向左移一张图片

							$('#info_left').show();
							$('#info_right').show();
							$('#imgShow').attr('src', showImgSrc + "/show_img/" + imgShowNum + ".jpg");
							var pptLength = parseInt(stat.slice(stat.lastIndexOf("/") + 1));
							//alert(pptLength);
							initShowImgRotatorCss();
							isImgRotatorLeft(imgShowNum, pptLength);
						}

					}
					else if ('showRightImg' == funName)
					{

						if (false == stat.slice(stat.lastIndexOf("/") + 1))		//如果返回0, 就到了最后一张.右面的导航去掉
						{
							$('#info_right').hide();
						}
						else
						{
							$('#info_left').show();
							$('#info_right').show();
							$('#imgShow').attr('src', showImgSrc + "/show_img/" + imgShowNum + ".jpg");
							initShowImgRotatorCss();
							isImgRotatorRight(imgShowNum);
						}
					}

				},
		});
	}

	function isImgRotatorLeft(imgShowNum, pptLength)
	{
		
		var showsrc = $('#imgShow').attr('src');
		var pptShowNum = parseInt(showsrc.slice(showsrc.lastIndexOf("/") + 1));			//正在显示的图片ppt编号
		var leftNum = $('.lableImg1 ').text();
		var rightNum = $('.lableImg5').text();
		if (pptShowNum >= leftNum && pptShowNum <= rightNum)
		{
			imgLightShow(imgShowNum - leftNum + 1);	
		}
		else 
		{
			if (pptLength - imgShowNum >= 5) 
			{
				var imgSrc = showsrc.slice(0, showsrc.lastIndexOf("class") + 6);
				//alert(imgShowNum);
				initShowImgRotator(imgSrc, imgShowNum - 1);
				imgLightShow(1);
			}
			else
			{
				var imgSrc = showsrc.slice(0, showsrc.lastIndexOf("class") + 6);
				//alert(imgShowNum);

				initShowImgRotator(imgSrc, pptLength - 5);
				imgLightShow(5 - (pptLength - imgShowNum));
			}

		}
	}

	function isImgRotatorRight(imgShowNum)
	{
		
		var showsrc = $('#imgShow').attr('src');
		var pptShowNum = parseInt(showsrc.slice(showsrc.lastIndexOf("/") + 1));			//正在显示的图片ppt编号
		var leftNum = $('.lableImg1 ').text();
		var rightNum = $('.lableImg5').text();
		if (pptShowNum >= leftNum && pptShowNum <= rightNum)
		{
			imgLightShow(imgShowNum - leftNum + 1);	
		}
		else 
		{
			
			var imgSrc = showsrc.slice(0, showsrc.lastIndexOf("class") + 6);
			//alert(imgShowNum);
			if (imgShowNum - 5 > 0)
			{
				initShowImgRotator(imgSrc, imgShowNum - 5);
				imgLightShow(5);
			}
			else
			{
				initShowImgRotator(imgSrc, 0);
				imgLightShow(imgShowNum);
			}

		}
	}


	$('#imgShow').click(function(event) {
		//alert(event.clientX + "   " + event.clientY);
		
		var odiv=document.getElementById('imgShow');
		var showCourseLeft = odiv.getBoundingClientRect().left;
		var showCourseRight = odiv.getBoundingClientRect().right;
		var showCourseTop = odiv.getBoundingClientRect().top;
		var showCourseBottom = odiv.getBoundingClientRect().bottom;
		var showCourseWidth = showCourseRight - showCourseLeft;
		 
		if (((event.clientX - showCourseLeft) < showCourseWidth/2) )	//向后
		{
			initShowImgRotatorCss();
			$('#info_right').show();
			imgProOrNext('#imgShow', 'showLeftImg');
			
		}
		else if (((event.clientX - showCourseLeft) > showCourseWidth/2))	//向前
		{
			initShowImgRotatorCss();
			$('#info_left').show();
			imgProOrNext('#imgShow', 'showRightImg');
		}
			
	});

	$('.messageSub').click(function () {
		var name = $('#messageName').val();
		var email = $('#messageEmail').val();
		var message = $('#messageMessage').val();
		var studentNun = $('#studentNun').val();
		if (message == '')
			alert('pleace add message');
		else
		{
			$.ajax({
				type : 'post',
				url : URL + "/sendMessage",
				data : {
					name: name,
					email: email,
					message:message,
					stuNum:studentNun
				},
				success : function (stat) {
					if (stat == 'true')
						//alert('success');
					document.location.href= URL;		//刷新子页面

				}
			});
		}
	});

// ==========================================================================//




});