- 删除 HTML 中的进度条元素 - 移除 CSS 中进度条相关样式 - 简化 JavaScript 代码,移除进度条更新逻辑 - 保留自动播放和按钮切换功能 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
29
js/index.js
29
js/index.js
@@ -266,13 +266,10 @@ $(function () {
|
||||
(function () {
|
||||
const $tabs = $('.solution-tab');
|
||||
const $slides = $('.solution-slide');
|
||||
const $progressBar = $('.progress-bar');
|
||||
const totalSlides = $slides.length;
|
||||
let currentIndex = 0;
|
||||
let autoPlayTimer = null;
|
||||
let progressTimer = null;
|
||||
const autoPlayDuration = 3000; // 3秒自动切换
|
||||
const progressInterval = 100; // 进度条更新间隔
|
||||
|
||||
// 切换到指定幻灯片
|
||||
function switchSlide(index) {
|
||||
@@ -287,9 +284,6 @@ $(function () {
|
||||
$tabs.eq(index).addClass('active');
|
||||
|
||||
currentIndex = index;
|
||||
|
||||
// 重置进度条
|
||||
resetProgress();
|
||||
}
|
||||
|
||||
// 切换到下一张
|
||||
@@ -298,28 +292,9 @@ $(function () {
|
||||
switchSlide(nextIndex);
|
||||
}
|
||||
|
||||
// 重置进度条
|
||||
function resetProgress() {
|
||||
$progressBar.css('width', '0%');
|
||||
clearInterval(progressTimer);
|
||||
|
||||
let progress = 0;
|
||||
const step = (progressInterval / autoPlayDuration) * 100;
|
||||
|
||||
progressTimer = setInterval(function () {
|
||||
progress += step;
|
||||
if (progress >= 100) {
|
||||
progress = 100;
|
||||
clearInterval(progressTimer);
|
||||
}
|
||||
$progressBar.css('width', progress + '%');
|
||||
}, progressInterval);
|
||||
}
|
||||
|
||||
// 启动自动播放
|
||||
function startAutoPlay() {
|
||||
stopAutoPlay();
|
||||
resetProgress();
|
||||
autoPlayTimer = setInterval(nextSlide, autoPlayDuration);
|
||||
}
|
||||
|
||||
@@ -329,10 +304,6 @@ $(function () {
|
||||
clearInterval(autoPlayTimer);
|
||||
autoPlayTimer = null;
|
||||
}
|
||||
if (progressTimer) {
|
||||
clearInterval(progressTimer);
|
||||
progressTimer = null;
|
||||
}
|
||||
}
|
||||
|
||||
// 按钮点击事件
|
||||
|
||||
Reference in New Issue
Block a user