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 ''+''+''; }, }, 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'); }); })