lwwlgw/js/javascript.js

jQuery(function($){
	// banner轮播
	var number = $('.banner-swiper .swiper-slide').length;
	if(number>1){
		var bannerSwiper = new Swiper('.banner-swiper',{
			loop:true,//开启循环播放
			autoplay: {//开启自动播放
				delay:54000,
				disableOnInteraction: false,//触摸后不会停止自动滚动
				pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
			},
			pagination: {
				el: '.banner-swiper .swiper-pagination',
				clickable :true,
			},
			effect : 'fade',//轮播的动效 默认为"slide"（普通位移切换），还可设置为"fade"（淡入）、"cube"（方块）、"coverflow"（3d流）、"flip"（3d翻转）、"cards"(卡片式)、"creative"（创意性）。
			fadeEffect: {
				crossFade: true,
			},
			on:{
				init: function(){
					swiperAnimateCache(this); //隐藏动画元素 
					swiperAnimate(this); //初始化完成开始动画
				}, 
				slideChangeTransitionEnd: function(){ 
					swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
					// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次，去除ani类名
				},
			}
		});
	}
	
	// 加载动画
	if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))){
		var wow = new WOW({
			boxClass: 'wow',
			animateClass: 'animated',
			offset: -50,
			mobile: true,
			live: true 
		});
		wow.init();  
	};
	
	// 首页产品切换
	$(".index-product-item>li").eq(0).addClass("active");
	$(".index-product-list>li").eq(0).addClass("cur");
	$('.index-product-item>li').click(function(){
		$(".index-product-item>li").eq($(this).index()).addClass("active").siblings().removeClass('active');
		$(".index-product-list>li").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
	});
	
	// 应用场景切换
	$('.scene-list>li').find('h3').click(function() {
		if($(this).parent().attr('class') == 'wow fadeInUp animated active'){
			$('.scene-list>li').removeClass('active');
			$(this).parent().find('.product-scene-txt').removeClass('cur')
		}else{
			$('.scene-list>li').removeClass('active')
			$('.scene-list>li').find('.product-scene-txt').removeClass('cur')
			$(this).parent().addClass('active')
			$(this).parent().find('.product-scene-txt').addClass('cur')
		}
	});
	
	// 案例滚动
	var productCaseSwiper = new Swiper('.product-case-swiper',{
		loop:false,//开启循环播放
		autoplay: {//开启自动播放
			delay:3000,
		},
		pagination: {
			el: '.case-list-bg .swiper-pagination',
			clickable :true,
		},
		navigation: {
			nextEl: '.case-list-bg .swiper-button-next',
			prevEl: '.case-list-bg .swiper-button-prev',
		},
		effect : 'slide',
		on: {
			slideChange: function(){
			    $('.product-case-swiper').find('.case-txt').removeClass('open');
			    $('.product-case-swiper').find(".case-btns").html("展开详情");
			},
		}
	});
	
	// 案例展开详情
	$('.case-btns').click(function() {
		if($(this).parent().find('.case-txt').attr('class') == 'case-txt open'){
			$('.product-case-swiper').find('.case-txt').removeClass('open');
			$('.product-case-swiper').find(".case-btns").html("展开详情");
		}else{
			$('.product-case-swiper').find('.case-txt').removeClass('open');
			$(this).parent().find('.case-txt').addClass('open');
			$('.product-case-swiper').find(".case-btns").html("展开详情");
			$(this).parent().find(".case-btns").html("收起详情");
		}
	});
	
	// 展品中心锚点
	$('.introduce-btn').click(function(){
		$('html,body').animate({scrollTop:$('.product-introduce-bg').offset().top - 85}, 1000);
		$('.side-left>a').removeClass("active");
		$(this).addClass("active");
	});
	$('.scene-btn').click(function(){
		$('html,body').animate({scrollTop:$('.product-scene-bg').offset().top - 85}, 1000);
		$('.side-left>a').removeClass("active");
		$(this).addClass("active");
	});
	$('.case-btn').click(function(){
		$('html,body').animate({scrollTop:$('.product-case-bg').offset().top - 85}, 1000);
		$('.side-left>a').removeClass("active");
		$(this).addClass("active");
	});
	
	
	// 大事件滚动
	var memorabiliaThumbnailSwiper = new Swiper('.memorabilia-thumbnail-swiper',{
		slidesPerView: 7,
		spaceBetween: 0,
		watchSlidesVisibility: true,//防止不可点击
	})
	var memorabiliaSwiper = new Swiper('.memorabilia-swiper',{
		autoplay: true,
		effect : 'fade',
		fadeEffect: {
			crossFade: true,
		},
		navigation: {
		  nextEl: '.memorabilia-swiper .swiper-button-next',
		  prevEl: '.memorabilia-swiper .swiper-button-prev',
		},
		thumbs: {
			swiper: memorabiliaThumbnailSwiper,
		},
		on:{
			init: function(){
				swiperAnimateCache(this); //隐藏动画元素 
				swiperAnimate(this); //初始化完成开始动画
			}, 
			slideChangeTransitionEnd: function(){ 
				swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
				// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次，去除ani类名
			},
		}
	})
	
	
	// 加入我们滚动
	var joinThumbnailSwiper = new Swiper('.join-thumbnail-swiper',{
		direction: 'vertical',
		slidesPerView: 8,
		watchSlidesVisibility: true,//防止不可点击
	})
	var joinSwiper = new Swiper('.join-swiper',{
		autoplay: false,
		effect : 'fade',
		fadeEffect: {
			crossFade: true,
		},
		navigation: {
		  nextEl: '.join-btns .swiper-button-next',
		  prevEl: '.join-btns .swiper-button-prev',
		},
		thumbs: {
			swiper: joinThumbnailSwiper,
		},
		on:{
			init: function(){
				swiperAnimateCache(this); //隐藏动画元素 
				swiperAnimate(this); //初始化完成开始动画
			}, 
			slideChangeTransitionEnd: function(){ 
				swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
				// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次，去除ani类名
			},
		}
	})
	
	// 运维服务内容切换
	$(".ywfw-item>li").eq(0).addClass("active");
	$(".ywfw-list>li").eq(0).addClass("cur");
	$('.ywfw-item>li').click(function(){
		$(".ywfw-item>li").eq($(this).index()).addClass("active").siblings().removeClass('active');
		$(".ywfw-list>li").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
	});
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	// 悬浮
	$('.open-suspension').click(function(){
		$('.suspension').toggleClass('show');
		$(this).toggleClass('open');
	});
	
	// 语言选择
	$('.language').click(function(){
		$('.language>img').eq(1).toggleClass('open');
		$('.language-select>.select').toggle();
	});
	
	// 搜索
	$('.search>span').click(function(){
		$('.search-son').toggle();
	});
	
	// 二级栏目切换
	if(screen.width <= 780){
		$(".sub-left>span").eq(0).addClass("cur");
		$(".sub-right>span").eq(0).show();
		$('.sub-left>span').click(function(){
			$(".sub-left>span").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
			$(".sub-right>span").hide().eq($(this).index()).show();
		});
		
		$(".sub-left-01>span").eq(0).addClass("cur");
		$(".sub-right-01>span").eq(0).show();
		$('.sub-left-01>span').click(function(){
			$(".sub-left-01>span").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
			$(".sub-right-01>span").hide().eq($(this).index()).show();
		});
		
	}else{
		$(".sub-left>span").eq(0).addClass("cur");
		$(".sub-right>span").eq(0).show();
		$('.sub-left>span').hover(function(){
			$(".sub-left>span").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
			$(".sub-right>span").hide().eq($(this).index()).show();
		});
		
		$(".sub-left-01>span").eq(0).addClass("cur");
		$(".sub-right-01>span").eq(0).show();
		$('.sub-left-01>span').hover(function(){
			$(".sub-left-01>span").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
			$(".sub-right-01>span").hide().eq($(this).index()).show();
		});
	}
	
	// 首页视屏轮播
	var number = $('.about-video-swiper .swiper-slide').length;
	if(number>1){
		var bannerSwiper = new Swiper('.about-video-swiper',{
			loop:true,//开启循环播放
			autoplay: {//开启自动播放
				delay:3000,
				disableOnInteraction: false,//触摸后不会停止自动滚动
				pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
			},
			pagination: {
				el: '.about-video-swiper .swiper-pagination',
				clickable :true,
				renderBullet: function (index, className) {
				  return '<span class="' + className + '">'+'<em></em>'+'</span>';
				},
			},
			effect : 'fade',//轮播的动效 默认为"slide"（普通位移切换），还可设置为"fade"（淡入）、"cube"（方块）、"coverflow"（3d流）、"flip"（3d翻转）、"cards"(卡片式)、"creative"（创意性）。
			fadeEffect: {
				crossFade: true,
			},
			on:{
				init: function(){
					swiperAnimateCache(this); //隐藏动画元素 
					swiperAnimate(this); //初始化完成开始动画
				}, 
				slideChangeTransitionEnd: function(){ 
					swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
					// this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次，去除ani类名
				} 
			}
		});
	}
	
	// 解决方案滚动
	if(screen.width <= 768){
		var solutionNavSwiper = new Swiper('.solution-nav-swiper',{
			slidesPerView: 'auto',
			slidesPerGroup: 1,
			slidesPerGroupAuto: true,
			autoplay:false,
		})
	}else{
		var solutionNavSwiper = new Swiper('.solution-nav-swiper',{
			slidesPerView: 6,
			spaceBetween: 5,
			slidesPerGroup: 1,
			slidesPerGroupAuto: true,
			autoplay:false,
		})
	}
	
	// 案例详情页滚动
	var caseThumbnailSwiper = new Swiper('.case-thumbnail-swiper',{
		direction: 'vertical',
		slidesPerView: 4,
		watchSlidesVisibility: true,//防止不可点击
	})
	var caseSwiper = new Swiper('.case-swiper',{
		autoplay: true,
		effect : 'fade',
		fadeEffect: {
			crossFade: true,
		},
		navigation: {
		  nextEl: '.case-thumbnail-bg .swiper-button-next',
		  prevEl: '.case-thumbnail-bg .swiper-button-prev',
		},
		thumbs: {
			swiper: caseThumbnailSwiper,
		},
	})
	
	// 产品详情页滚动
	var productThumbnailSwiper = new Swiper('.product-thumbnail-swiper',{
		slidesPerView: 5,
		spaceBetween: 4,
		watchSlidesVisibility: true,//防止不可点击
	})
	var productSwiper = new Swiper('.product-swiper',{
		autoplay: true,
		effect : 'fade',
		fadeEffect: {
			crossFade: true,
		},
		navigation: {
		  nextEl: '.product-thumbnail-bg .swiper-button-next',
		  prevEl: '.product-thumbnail-bg .swiper-button-prev',
		},
		thumbs: {
			swiper: productThumbnailSwiper,
		},
	})
	
	// 产品详情页切换
	$(".product-btns>span").eq(0).addClass("active");
	$(".body-txt>.txt-item").eq(0).show();
	$('.product-btns>span').click(function(){
		$(".product-btns>span").eq($(this).index()).addClass("active").siblings().removeClass('active');
		$(".body-txt>.txt-item").hide().eq($(this).index()).show();
	});

	// 解决方案选项卡
	$('.index-solution-nav .swiper-wrapper>.swiper-slide').eq(0).addClass('cur');
	$('.index-solution-list>li').eq(0).show();
	$('.solution-more-list>li').eq(0).addClass('show');
	$('.index-solution-more').addClass('active');
	$('.index-solution-nav .swiper-wrapper>.swiper-slide').click(function(){
		$('.index-solution-nav .swiper-wrapper>.swiper-slide').eq($(this).index()).addClass("cur").siblings().removeClass('cur');
		$('.index-solution-list>li').eq($(this).index()).show().siblings().hide();
		$('.solution-more-list>li').eq($(this).index()).addClass("show").siblings().removeClass('show');
		$('.index-solution-more').addClass('active');
	});
	$('.solution-txt>.more').click(function(){
		$('.index-solution-more').addClass('active');
	});
	$('.solution-more-btn').click(function(){
		$('.index-solution-more').removeClass('active');
	});
	
	// // 历程滚动
	// if(screen.width <= 768){
	// 	var memorabiliSwiper = new Swiper('.memorabili-swiper',{
	// 		loop:false,//开启循环播放
	// 		autoplay : {
	// 			delay:3000,
	// 			disableOnInteraction: false,
	// 		},
	// 		effect : 'fade',
	// 		fadeEffect: {
	// 		    crossFade: true,
	// 		  },
	// 		navigation: {
	// 			prevEl: '.memorabili-swiper .swiper-button-prev',
	// 			nextEl: '.memorabili-swiper .swiper-button-next',
	// 		},
			
	// 	})
	// }else{
	// 	var memorabiliSwiper = new Swiper('.memorabili-swiper',{
	// 		loop:false,//开启循环播放
	// 		autoplay: true,
	// 		slidesPerView : '6',
	// 		centeredSlides : false,
	// 		navigation: {
	// 			prevEl: '.memorabili-swiper .swiper-button-prev',
	// 			nextEl: '.memorabili-swiper .swiper-button-next',
	// 		},
	// 		on:{
	// 		    slideChange: function(){
	// 				var a = this.activeIndex;
	// 				var b = a + 6;
	// 				var c = a - 1;
	// 				$(".memorabili-swiper").find(".swiper-slide").css("opacity",1);
	// 				$(".memorabili-swiper").find(".swiper-slide").eq(c).css("opacity",0);
	// 				$(".memorabili-swiper").find(".swiper-slide").eq(b).css("opacity",0);
	// 		    },
	// 		  },
			
	// 	})
	// }
	
	// 视频播放
	$('.video-slide').find('video').eq(0).trigger('play');
	$('.video-swiper-wrapper>.swiper-slide').click(function(){
		$('.video-list-bg').show();
		$(".video-list>li").eq($(this).index()-1).addClass("show").siblings().removeClass('show');
		$(".video-list>li").eq($(this).index()-1).find('video').trigger('play').siblings().find('video').trigger('pause');
		$('.video-slide').find('video').trigger('pause');
	});
	$('.close-video').click(function(){
		$('.video-list-bg').hide();
		$(".video-list>li").removeClass('show');
		$(".video-list>li").find('video').trigger('pause');
		$('.video-slide').find('video').trigger('pause');
	});
	
	// 关于我们视频播放
	$('.strength-img').click(function(){
		$('.video-list-bg').show();
		$(".video-list>li").addClass('show');
	});
	$('.close-video').click(function(){
		$('.video-list-bg').hide();
		$(".video-list>li").removeClass('show');
	});
	// 荣誉资质滚动
	if(screen.width <= 768){
		var honorSwiper = new Swiper('.honor-swiper',{
			loop:false,//开启循环播放
			autoplay : {
				delay:3000,
				disableOnInteraction: false,
			},
			effect : 'fade',
			fadeEffect: {
			    crossFade: true,
			  },
			navigation: {
				prevEl: '.honor-swiper .swiper-button-prev',
				nextEl: '.honor-swiper .swiper-button-next',
			},
			
		})
	}else{
		var honorSwiper = new Swiper('.honor-swiper',{
			loop:false,//开启循环播放
			autoplay: false,
			navigation: {
				prevEl: '.honor-list>.swiper-button-prev',
				nextEl: '.honor-list>.swiper-button-next',
			},
		})
	}
	
	// 弹出荣誉资质
	$('.honor-list .swiper-slide').click(function(){
		$('.honor-list-other').removeClass("hide");
		$('.all-bg').show();
	});
	$('.close-swiper').click(function(){
		$('.honor-list-other').addClass("hide");
		$('.all-bg').hide();
	});
	
	// 荣誉资质弹出滚动
	var honorOtherSwiper = new Swiper('.honor-other-swiper',{
		loop:false,//开启循环播放
		autoplay: true,
		navigation: {
			prevEl: '.honor-list-other>.swiper-button-prev',
			nextEl: '.honor-list-other>.swiper-button-next',
		},
	})
	
	
	// 列表页二级导航切换
	var pullNavSwiper = new Swiper('.pull-nav-swiper',{
		slidesPerView: 'auto',
		slidesPerGroup: 1,
		slidesPerGroupAuto: true,
		autoplay:false,
		navigation: {
			nextEl: '.pull-nav .swiper-button-next',
			prevEl: '.pull-nav .swiper-button-prev',
		},
	})
	
	// 列表页三级导航切换
	var navThreeSwiper = new Swiper('.nav-three-swiper',{
		slidesPerView: 'auto',
		slidesPerGroup: 1,
		slidesPerGroupAuto: true,
		autoplay:false,
	})
	
	// 招聘信息展开
	$('.item-btns').click(function() {
		if($(this).parent().attr('class') == 'wow fadeInUp animated active'){
			$('.recruit-list>li').removeClass('active');
			$(this).parent().find('.txt').removeClass('cur')
			$('.recruit-list>li').find("em").html("+")
		}else{
			$('.recruit-list>li').removeClass('active')
			$('.recruit-list>li').find('.txt').removeClass('cur')
			$(this).parent().addClass('active')
			$(this).parent().find('.txt').addClass('cur')
			$('.recruit-list>li').find("em").html("+")
			$('.recruit-list>li.active').find("em").html("-")
		}
	});
	
	// 返回顶部
	$('.back-top').click(function(){
		$('html,body').animate({scrollTop:$('#top').offset().top}, 1000);
	});
	
	// 关于我们锚点
	if(screen.width <= 780){
		$('.survey-btn').click(function(){
			$('html,body').animate({scrollTop:$('.about-survey-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.course-btn').click(function(){
			$('html,body').animate({scrollTop:$('.about-course-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.strength-btn').click(function(){
			$('html,body').animate({scrollTop:$('.strength-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.vision-btn').click(function(){
			$('html,body').animate({scrollTop:$('.vision-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.honor-btn').click(function(){
			$('html,body').animate({scrollTop:$('.honor-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.social-btn').click(function(){
			$('html,body').animate({scrollTop:$('.social-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
	}else{
		$('.survey-btn').click(function(){
			$('html,body').animate({scrollTop:$('.about-survey-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.course-btn').click(function(){
			$('html,body').animate({scrollTop:$('.about-course-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.strength-btn').click(function(){
			$('html,body').animate({scrollTop:$('.strength-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.vision-btn').click(function(){
			$('html,body').animate({scrollTop:$('.vision-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.honor-btn').click(function(){
			$('html,body').animate({scrollTop:$('.honor-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.social-btn').click(function(){
			$('html,body').animate({scrollTop:$('.social-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
	}
	
	//职业发展锚点
	if(screen.width <= 780){
		$('.idea-btn').click(function(){
			$('html,body').animate({scrollTop:$('.idea-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.culture-btn').click(function(){
			$('html,body').animate({scrollTop:$('.culture-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.recruit-btn').click(function(){
			$('html,body').animate({scrollTop:$('.recruit-bg').offset().top - 50}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
	}else{
		$('.idea-btn').click(function(){
			$('html,body').animate({scrollTop:$('.idea-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.culture-btn').click(function(){
			$('html,body').animate({scrollTop:$('.culture-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
		$('.recruit-btn').click(function(){
			$('html,body').animate({scrollTop:$('.recruit-bg').offset().top - 80}, 1000);
			$('.pull-nav .swiper-slide>a').removeClass("active");
			$(this).addClass("active");
		});
	}

	// 手机导航按钮
	$('.head .head-btn').click(function() {
	    if ($('.head .head-btn').attr('class') == 'head-btn cur') {
	        $('.head .head-btn').removeClass('cur');
	        $('.head .nav').removeClass('active');
			$('.head .nav-bg').removeClass('active');
	    } else {
	        $('.head .head-btn').addClass('cur');
	        $('.head .nav').addClass('active');
			$('.head .nav-bg').addClass('active');
			$('.head .logo').addClass('active');
	    }
	});
	$('.head .nav-bg').click(function() {
		$(this).removeClass('active');
	    $('.head .head-btn').removeClass('cur');
	    $('.head .nav').removeClass('active');
	});
	
})