优化动画

This commit is contained in:
CN-JS-HuiBai
2026-04-06 02:23:11 +08:00
parent e4b97be54e
commit 217510c07d
2 changed files with 48 additions and 18 deletions

View File

@@ -208,15 +208,34 @@
}
// Globe expansion
function expandGlobe() {
if (dom.globeCard.classList.contains('expanded')) return;
dom.globeCard.classList.add('expanded');
dom.btnExpandGlobe.classList.add('active');
dom.globeCard.addEventListener('animationend', function onExpand() {
dom.globeCard.removeEventListener('animationend', onExpand);
if (myMap2D) myMap2D.resize();
});
}
function collapseGlobe() {
if (!dom.globeCard.classList.contains('expanded')) return;
if (dom.globeCard.classList.contains('globe-collapsing')) return;
dom.globeCard.classList.add('globe-collapsing');
dom.globeCard.addEventListener('animationend', function onCollapse() {
dom.globeCard.removeEventListener('animationend', onCollapse);
dom.globeCard.classList.remove('expanded', 'globe-collapsing');
dom.btnExpandGlobe.classList.remove('active');
if (myMap2D) requestAnimationFrame(() => myMap2D.resize());
});
}
if (dom.btnExpandGlobe) {
dom.btnExpandGlobe.addEventListener('click', () => {
dom.globeCard.classList.toggle('expanded');
dom.btnExpandGlobe.classList.toggle('active');
if (myMap2D) {
// Single deferred resize after the DOM has applied the new layout
requestAnimationFrame(() => {
myMap2D.resize();
});
if (dom.globeCard.classList.contains('expanded')) {
collapseGlobe();
} else {
expandGlobe();
}
});
}
@@ -227,11 +246,7 @@
closeSettings();
closeLoginModal();
closeServerDetail();
if (dom.globeCard && dom.globeCard.classList.contains('expanded')) {
dom.globeCard.classList.remove('expanded');
dom.btnExpandGlobe.classList.remove('active');
if (myMap2D) requestAnimationFrame(() => myMap2D.resize());
}
collapseGlobe();
}
});