Skip to content

Commit

Permalink
edit
Browse files Browse the repository at this point in the history
  • Loading branch information
YuxuannSun committed Nov 12, 2024
1 parent c97bbf3 commit d19a9cb
Showing 1 changed file with 0 additions and 60 deletions.
60 changes: 0 additions & 60 deletions _pages/about.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,66 +11,6 @@ redirect_from:
Recent work at a glance
------

<script>
let currentIndex = 0;
const images = [
'/images/glance-images/glance-001.jpg',
'/images/glance-images/glance-002.jpg',
'/images/glance-images/glance-003.jpg',
'/images/glance-images/glance-004.png',
'/images/glance-images/glance-005.png',
'/images/glance-images/glance-006.png',
'/images/glance-images/glance-007.png',
'/images/glance-images/glance-008.png',
'/images/glance-images/glance-009.png',
'/images/glance-images/glance-010.png',
'/images/glance-images/glance-011.png'
];

const mainImage = document.getElementById("mainImage");
const thumbnails = document.querySelectorAll(".thumbnail");
let autoSlide;

// 自动滚动播放功能
function startAutoSlide() {
autoSlide = setInterval(() => {
currentIndex = (currentIndex + 1) % images.length;
updateMainImage(currentIndex);
}, 3000); // 每3秒切换
}

// 更新主图片和缩略图高亮状态
function updateMainImage(index) {
mainImage.src = images[index];

// 更新缩略图样式
thumbnails.forEach(img => img.style.opacity = 0.6);
thumbnails[index].style.opacity = 1;
}

// 点击缩略图时切换图片并暂停自动播放
function changeImage(src, thumbnail) {
mainImage.src = src;

// 停止自动播放
clearInterval(autoSlide);

// 重置所有缩略图透明度
thumbnails.forEach(img => img.style.opacity = 0.6);
thumbnail.style.opacity = 1;

// 更新当前索引
currentIndex = images.indexOf(src);

// 重新启动自动播放
startAutoSlide();
}

// 初始化自动播放
startAutoSlide();
</script>


<div style="display: flex; max-width: 800px; margin: auto;">

<!-- 主显示图片 -->
Expand Down

0 comments on commit d19a9cb

Please sign in to comment.