zzwy-news/js/script.js

231 lines
7.2 KiB
JavaScript
Raw Normal View History

2022-09-23 10:15:52 +00:00
$(function(){
// 滑动页面更改头部效果
2022-09-27 10:42:52 +00:00
// 手机端显示头部
if(screen.width <= 768){
$('.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');
}
});
}
2022-09-23 10:15:52 +00:00
// 轮播动画
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');
$('.index-news-nav>span').click(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');
}
})
// 公司新闻切换
var newsSwiper = new Swiper('.news-swiper',{
direction: 'vertical', //向上
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:2000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
},
effect : 'fade',
fadeEffect: {
crossFade: true,
},
pagination: {
el: '.news-swiper .swiper-pagination',
clickable :true,
},
});
// 区域动态切换
var informationSwiper = new Swiper('.information-swiper',{
direction: 'vertical', //向上
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:2000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
},
effect : 'fade',
fadeEffect: {
crossFade: true,
},
pagination: {
el: '.information-swiper .swiper-pagination',
clickable :true,
},
});
}
// 管理团队切换
if($('.management-team-nav').length){
$('.management-team-nav>span').eq(0).addClass('active');
$('.management-team-nav>span').click(function(){
if(!$(this).hasClass('active')){
$('.management-team-nav>span').eq($(this).index()).addClass("active").siblings().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',
},
});
2022-09-26 10:22:55 +00:00
$('.history .img>span').eq(0).addClass('active');
$('.history-swiper .swiper-slide').click(function(){
$('.history .img>span').eq($(this).index()).addClass("active").siblings().removeClass('active');
})
2022-09-23 10:15:52 +00:00
}
// 活动预告切换
if($('.preview-swiper').length){
var previewSwiper = new Swiper('.preview-swiper',{
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:3000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
},
slidesPerView: "auto",
centeredSlides:true,
spaceBetween: 40,
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',
},
});
}
2022-09-26 10:22:55 +00:00
// 友邻市集服务活动切换
if($('.market-swiper').length){
var historySwiper = 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类名
},
}
});
}
2022-09-23 10:15:52 +00:00
// 执行加载动画
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: false, /* 是否在移动设备执行动画 */
live: true /* 异步加载的内容是否有效 */
});
wow.init();
};
2022-09-27 10:42:52 +00:00
// 手机导航按钮
$('.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 .nav-bg').click(function() {
$(this).removeClass('active');
$('.head .head-btn').removeClass('cur');
$('.head .nav').removeClass('active');
});
2022-09-23 10:15:52 +00:00
})