snky-new/js/javascript.js

168 lines
5.5 KiB
JavaScript
Raw Normal View History

2022-02-10 15:25:44 +00:00
jQuery(function($){
// banner轮播
var number = $('.banner-swiper .swiper-slide').length;
if(number>1){
var bannerSwiper = new Swiper('.banner-swiper',{
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:3000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
},
pagination: {
el: '.banner-swiper .swiper-pagination',
clickable :true,
},
effect : 'slide',//轮播的动效 默认为"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类名
}
}
});
}
// 首页新闻动态切换
$(".index-title-item>li").eq(0).addClass("active");
$(".index-news-all>div").eq(0).addClass("cur");
$(".index-title-item>li").click(function() {
$(".index-title-item>li").eq($(this).index()).addClass("active").siblings().removeClass('active');
$(".index-news-all>div").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
});
// 首页主营业务切换
$(".index-business-item>li").eq(0).addClass("active");
$(".index-business-list>li").eq(0).addClass("cur");
$(".index-business-item>li").click(function() {
$(".index-business-item>li").eq($(this).index()).addClass("active").siblings().removeClass('active');
$(".index-business-list>li").eq($(this).index()).addClass("cur").siblings().removeClass('cur');
});
// 管理团队滚动
var teamSwiper = new Swiper('.team-swiper',{
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:3000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
},
pagination: {
el: '.team-swiper .swiper-pagination',
clickable :true,
},
effect : 'slide',//轮播的动效 默认为"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 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: false,
slidesPerView : '4',
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 + 4;
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);
},
},
})
}
// 主营业务滚动
var viewSwiper = new Swiper('.view-swiper', {
navigation: {
prevEl: '.preview .preview-arrow-prev',
nextEl: '.preview .preview-arrow-next',
},
thumbs: {
swiper: {
el: '.preview-swiper', //注意此处的设置方式
watchSlidesVisibility: true,//防止不可点击
},
}
});
// // 回到顶部
// $('#toTop').click(function(){$('html,body').animate({scrollTop:$('#top').offset().top}, 600);});
// // 产品锚点
// $('.onExperience').click(function(){
// $('html,body').animate({scrollTop:$('.experience-bg').offset().top - 122}, 600);
// $('.product-nav-item>li').removeClass("active");
// $(this).addClass("active");
// });
// // 判断价格图片是否为空
// if(!$('.price img').attr('src')){
// $(".price").html("<span>定价图片后台上传</span>");
// }
// 手机导航按钮
$('.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');
});
})