fix(wish-tree): 弹幕一行一条排队播放,不再重叠
Publish Mini Program Dev Version / publish (push) Successful in 1m4s

- 顶部滚动行上移紧贴置顶轮播(16%→12%)
- 树桩3行改为68/73/78%,更紧凑
- 核心修复重叠:弃用CSS无限循环+负delay(同屏多条),
  改为JS定时器按行调度,同一行一条飘完再出下一条,循环播放
- 弹幕动画改为只播一次,key含时间戳保证切换时重新触发动画
- 页面onHide/onUnload停止定时器,onShow恢复
This commit is contained in:
gouki
2026-08-10 13:27:19 +00:00
parent 87f5fa2478
commit a29328f35b
3 changed files with 106 additions and 32 deletions
+3 -2
View File
@@ -142,7 +142,8 @@
text-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.6);
animation-name: danmaku;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-iteration-count: 1;
animation-fill-mode: both;
will-change: transform;
}
@@ -608,7 +609,7 @@
}
}
/* 弹幕:从屏幕右侧飘到左侧 */
/* 弹幕:从屏幕右侧飘到左侧。每条只播一次,由 JS 控制一行一条排队出现。 */
@keyframes danmaku {
0% {
transform: translateX(100vw);