82 lines
2.8 KiB
JavaScript
82 lines
2.8 KiB
JavaScript
$(function () {
|
|
console.log('tools.js loaded');
|
|
|
|
// 产品详情页的图片预览轮播（仅在存在时初始化）
|
|
if ($('.gallery-thumbs').length > 0 && $('.gallery-top').length > 0) {
|
|
console.log('Initializing gallery swiper');
|
|
var galleryThumbs = new Swiper('.gallery-thumbs', {
|
|
spaceBetween: 10,
|
|
slidesPerView: 10,
|
|
freeMode: true,
|
|
watchSlidesVisibility: true,
|
|
watchSlidesProgress: true,
|
|
noSwiping: true
|
|
});
|
|
var galleryTop = new Swiper('.gallery-top', {
|
|
spaceBetween: 10,
|
|
thumbs: {
|
|
swiper: galleryThumbs
|
|
},
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
});
|
|
}
|
|
|
|
// 首页 Banner 轮播（仅在存在时初始化）
|
|
if ($('.banner-cont').length > 0) {
|
|
console.log('Found .banner-cont, initializing banner swiper');
|
|
console.log('Number of slides:', $('.banner-cont .swiper-slide').length);
|
|
|
|
const mySwiper = new Swiper(".banner-cont", {
|
|
loop: true, // 循环模式选项
|
|
autoplay: {
|
|
delay: 5000, // 5秒自动切换
|
|
disableOnInteraction: false, // 用户操作后继续自动播放
|
|
},
|
|
speed: 800, // 切换速度
|
|
// 分页器配置
|
|
pagination: {
|
|
el: ".swiper-pagination",
|
|
clickable: true,
|
|
type: 'bullets',
|
|
},
|
|
// 监听切换事件，重置进度条动画
|
|
on: {
|
|
slideChange: function () {
|
|
console.log('Slide changed');
|
|
// 移除所有进度条动画
|
|
document.querySelectorAll('.banner-cont .swiper-pagination-bullet').forEach(function(bullet) {
|
|
bullet.classList.remove('progress-active');
|
|
});
|
|
// 给当前激活的添加进度动画
|
|
const activeBullet = document.querySelector('.banner-cont .swiper-pagination-bullet-active');
|
|
if (activeBullet) {
|
|
activeBullet.classList.add('progress-active');
|
|
console.log('Added progress-active to bullet');
|
|
}
|
|
},
|
|
init: function () {
|
|
console.log('Swiper initialized');
|
|
console.log('Pagination bullets:', document.querySelectorAll('.swiper-pagination-bullet').length);
|
|
// 初始化时给第一个添加进度动画
|
|
setTimeout(function() {
|
|
const activeBullet = document.querySelector('.banner-cont .swiper-pagination-bullet-active');
|
|
if (activeBullet) {
|
|
activeBullet.classList.add('progress-active');
|
|
console.log('Added initial progress-active to bullet');
|
|
} else {
|
|
console.log('No active bullet found');
|
|
}
|
|
}, 100);
|
|
}
|
|
}
|
|
});
|
|
|
|
console.log('Banner swiper created:', mySwiper);
|
|
} else {
|
|
console.log('.banner-cont not found');
|
|
}
|
|
})
|