mirror of
https://github.com/Ad-closeNN/blog-fuwari.git
synced 2026-05-31 01:40:03 -04:00
fix: 修复卡片载入动画重复播放的问题
CodeGeeX GLM 4.7 牛逼
This commit is contained in:
@@ -21,8 +21,6 @@ const interval = 50;
|
||||
image={entry.data.image}
|
||||
description={entry.data.description}
|
||||
draft={entry.data.draft}
|
||||
class:list="onload-animation"
|
||||
style={`animation-delay: calc(var(--content-delay) + ${delay++ * interval}ms);`}
|
||||
></PostCard>
|
||||
))}
|
||||
</div>
|
||||
@@ -412,6 +412,13 @@ function showBanner() {
|
||||
return;
|
||||
}
|
||||
|
||||
// 在显示Banner前,先移除所有已加载的onload-animation类,防止动画重复触发
|
||||
const animatedElements = document.querySelectorAll('.onload-animation');
|
||||
animatedElements.forEach(el => {
|
||||
el.style.animation = 'none';
|
||||
el.style.opacity = '1';
|
||||
});
|
||||
|
||||
banner.classList.remove('opacity-0', 'scale-105');
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user