279 lines
8.8 KiB
JavaScript
279 lines
8.8 KiB
JavaScript
$(function(){
|
||
// 滑动页面更改头部效果
|
||
if(window.innerWidth <= 960){
|
||
$('.header').addClass('header-white');
|
||
}else{
|
||
$(window).scroll(function(){
|
||
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
|
||
if(scrollTop > 10){
|
||
$('.header').addClass('header-white');
|
||
} else {
|
||
$('.header').removeClass('header-white');
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
// 轮播动画
|
||
if($('.banner-swiper').length){
|
||
var bannerSwiper = new Swiper('.banner-swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:3500,
|
||
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($('.index-news-nav').length){
|
||
// 导航切换
|
||
$('.index-news-nav>span').eq(0).addClass('active');
|
||
$('.new-list>.swiper').eq(0).addClass('show');
|
||
$(document).on('click','.index-news-nav>span',function() {
|
||
if(!$(this).hasClass('active')){
|
||
$('.index-news-nav>span').eq($(this).index()).addClass("active").siblings().removeClass('active');
|
||
$('.new-list>.swiper').eq($(this).index()).addClass("show").siblings().removeClass('show');
|
||
}else{
|
||
window.location.href = $(this).data('url');
|
||
}
|
||
})
|
||
if(window.innerWidth <= 960){
|
||
// 公司新闻切换
|
||
var newsSwiper = new Swiper('.new-list>.swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:2000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
slidesPerView: "auto",
|
||
centeredSlides:true,
|
||
pagination: {
|
||
el: '.new-list>.swiper .swiper-pagination',
|
||
clickable :true,
|
||
},
|
||
});
|
||
}else{
|
||
// 公司新闻切换
|
||
var newsSwiper = new Swiper('.new-list>.swiper',{
|
||
direction: 'vertical', //向上
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:2000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
effect : 'fade',
|
||
fadeEffect: {
|
||
crossFade: true,
|
||
},
|
||
pagination: {
|
||
el: '.new-list>.swiper .swiper-pagination',
|
||
clickable :true,
|
||
},
|
||
});
|
||
}
|
||
}
|
||
|
||
// 管理团队切换
|
||
if($('.management-team-list').length){
|
||
$('.management-team-nav>span').eq(0).addClass('active');
|
||
$('.management-team-list .management-team-item').eq(0).addClass('show');
|
||
$(document).on('click','.management-team-nav>span',function() {
|
||
var scrollTop = $(document).scrollTop();
|
||
if(!$(this).hasClass('active')){
|
||
$(document).scrollTop(scrollTop+1).scrollTop(scrollTop);
|
||
$('.management-team-nav>span').eq($(this).index()).addClass("active").siblings().removeClass('active');
|
||
$('.management-team-list .management-team-item').eq($(this).index()).addClass("show").siblings().removeClass('show');
|
||
}
|
||
})
|
||
}
|
||
|
||
// 尾部导航
|
||
if(window.innerWidth <= 960){
|
||
$(document).on('click','.foot-left>.item>a',function() {
|
||
if(!$(this).parent().hasClass('active')){
|
||
$('.foot-left>.item').removeClass('active');
|
||
$(this).parent().addClass("active");
|
||
}else{
|
||
$('.foot-left>.item').removeClass('active');
|
||
}
|
||
})
|
||
}
|
||
|
||
// 大事件切换
|
||
if($('.history-swiper').length){
|
||
var historySwiper = new Swiper('.history-swiper',{
|
||
direction: 'vertical', //向上
|
||
slidesPerView: 'auto',
|
||
navigation: {
|
||
nextEl: '.history-swiper-bg .swiper-button-next',
|
||
prevEl: '.history-swiper-bg .swiper-button-prev',
|
||
},
|
||
});
|
||
|
||
$('.history .img>span').eq(0).addClass('active');
|
||
$(document).on('click','.history-swiper .swiper-slide',function() {
|
||
$('.history .img>span').eq($(this).index()).addClass("active").siblings().removeClass('active');
|
||
})
|
||
}
|
||
|
||
|
||
// 活动预告切换
|
||
if($('.preview-swiper').length){
|
||
var previewSwiper = new Swiper('.preview-swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:3000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
slidesPerView: "auto",
|
||
centeredSlides:true,
|
||
navigation: {
|
||
nextEl: '.preview-swiper .swiper-button-next',
|
||
prevEl: '.preview-swiper .swiper-button-prev',
|
||
},
|
||
});
|
||
}
|
||
|
||
// 活动详情轮播
|
||
if($('.detail-swiper').length){
|
||
var detailSwiper = new Swiper('.detail-swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:3000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
effect : 'fade',
|
||
fadeEffect: {
|
||
crossFade: true,
|
||
},
|
||
pagination: {
|
||
el: '.detail-swiper .swiper-pagination',
|
||
type: 'fraction',
|
||
renderFraction: function (currentClass, totalClass) {
|
||
return '<span class="' + currentClass + '"></span>' +
|
||
'<em>/</em>' +
|
||
'<span class="' + totalClass + '"></span>';
|
||
},
|
||
},
|
||
navigation: {
|
||
nextEl: '.detail-swiper .swiper-button-next',
|
||
prevEl: '.detail-swiper .swiper-button-prev',
|
||
},
|
||
});
|
||
}
|
||
// 友邻集市社区切换
|
||
if($('.market-banner-swiper').length){
|
||
// 集市切换
|
||
var marketBannerSwiper = new Swiper('.market-banner-swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:3000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
pagination: {
|
||
el: '.market-banner-swiper .swiper-pagination',
|
||
clickable :true,
|
||
},
|
||
});
|
||
}
|
||
|
||
// 友邻市集活动切换
|
||
if($('.market-swiper').length){
|
||
if(window.innerWidth > 960){
|
||
var marketSwiper = new Swiper('.market-swiper',{
|
||
loop:true,//开启循环播放
|
||
autoplay: {//开启自动播放
|
||
delay:3000,
|
||
disableOnInteraction: false,//触摸后不会停止自动滚动
|
||
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换，鼠标离开时恢复自动切换。
|
||
},
|
||
pagination: {
|
||
el: '.market-swiper .swiper-pagination',
|
||
clickable :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', /* 执行动画的元素 class */
|
||
animateClass: 'animated', /* animate.css 动画的 class */
|
||
offset: 10, /* 距离可视区域多少开始执行动画 */
|
||
mobile: true, /* 是否在移动设备执行动画 */
|
||
live: true /* 异步加载的内容是否有效 */
|
||
});
|
||
wow.init();
|
||
};
|
||
|
||
// 手机导航按钮
|
||
if(window.innerWidth <= 960){
|
||
$(document).on('click','.head .head-btn',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');
|
||
}
|
||
});
|
||
|
||
$(document).on('click','.head .nav-bg',function() {
|
||
$(this).removeClass('active');
|
||
$('.head .head-btn').removeClass('cur');
|
||
$('.head .nav').removeClass('active');
|
||
});
|
||
}
|
||
|
||
// 手机端二级导航
|
||
if(window.innerWidth <= 960){
|
||
if($('.sub-nav-bg').length){
|
||
let parentWidth = $('.sub-nav-bg').width();
|
||
let offsetLeft = $('.sub-nav>.active').offset().left;
|
||
if(offsetLeft>parentWidth/2){
|
||
$('.sub-nav').scrollLeft(offsetLeft);
|
||
}
|
||
}
|
||
}
|
||
|
||
}) |