fix: 修复3D内推平台UI无法显示的严重问题
根本原因: - 在 init3DScene() 中错误地设置了父元素 uiLayer.style.opacity = '0' - 导致即使GSAP动画将子元素opacity设为1,整个UI层仍然透明 - CSS规则:父元素透明会导致所有子元素都不可见 修复方案: 1. 删除 js/main.js 中错误的 opacity 设置 2. 改用 GSAP 的 fromTo() 明确控制动画起始和结束状态 3. 不再依赖CSS或内联样式的不确定状态 修复效果: ✅ 第一次进入:文字正常淡入显示 ✅ 点击地球:正常转场到中国地图 ✅ 第二次进入:文字仍能正常淡入显示 ✅ 多次进出都能正常工作 🤖 Generated with Claude Code
This commit is contained in:
@@ -111,23 +111,35 @@ export class SceneManager {
|
||||
});
|
||||
|
||||
// B. UI 淡入 (标题和提示依次出现)
|
||||
tl.to('.v1-title', {
|
||||
opacity: 1,
|
||||
duration: 1.5,
|
||||
ease: "power2.out"
|
||||
}, `-=${animConfig.titleDelay}`);
|
||||
tl.fromTo('.v1-title',
|
||||
{ opacity: 0 },
|
||||
{
|
||||
opacity: 1,
|
||||
duration: 1.5,
|
||||
ease: "power2.out"
|
||||
},
|
||||
`-=${animConfig.titleDelay}`
|
||||
);
|
||||
|
||||
tl.to('.v1-subtitle', {
|
||||
opacity: 1,
|
||||
duration: 1.2,
|
||||
ease: "power2.out"
|
||||
}, `-=${animConfig.subtitleDelay}`);
|
||||
tl.fromTo('.v1-subtitle',
|
||||
{ opacity: 0 },
|
||||
{
|
||||
opacity: 1,
|
||||
duration: 1.2,
|
||||
ease: "power2.out"
|
||||
},
|
||||
`-=${animConfig.subtitleDelay}`
|
||||
);
|
||||
|
||||
tl.to('.instruction-hint', {
|
||||
opacity: 1,
|
||||
duration: 1.0,
|
||||
ease: "power2.out"
|
||||
}, `-=${animConfig.hintDelay}`);
|
||||
tl.fromTo('.instruction-hint',
|
||||
{ opacity: 0 },
|
||||
{
|
||||
opacity: 1,
|
||||
duration: 1.0,
|
||||
ease: "power2.out"
|
||||
},
|
||||
`-=${animConfig.hintDelay}`
|
||||
);
|
||||
}
|
||||
|
||||
// 初始化转场系统
|
||||
|
||||
Reference in New Issue
Block a user