zzwy-news/js/script.js

206 lines
6.5 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

$(function(){
// 滑动页面更改头部效果
$(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');
$('.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',
},
});
$('.history .img>span').eq(0).addClass('active');
$('.history-swiper .swiper-slide').click(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,
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',
},
});
}
// 友邻市集服务活动切换
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类名
},
}
});
}
// 执行加载动画
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();
};
})