From 01d6e87a5340fd5e791aad71719e263742a977a6 Mon Sep 17 00:00:00 2001 From: xugp <1292593309@qq.com> Date: Wed, 1 Apr 2026 12:00:00 +0800 Subject: [PATCH] Improve standalone rrweb demo replay controls --- index.html | 368 +++++++++++++++++++++++++++++++++++++++++------------ 1 file changed, 286 insertions(+), 82 deletions(-) diff --git a/index.html b/index.html index 118bb5dc..1df70c28 100644 --- a/index.html +++ b/index.html @@ -108,6 +108,54 @@ margin: 10px 0; padding-left: 20px; } + .replay-controls { + margin-top: 15px; + padding: 15px; + border: 1px solid #d8e2ef; + border-radius: 8px; + background: #fff; + } + .replay-controls.disabled { + opacity: 0.6; + } + .replay-row { + display: flex; + align-items: center; + gap: 12px; + flex-wrap: wrap; + } + .timeline { + flex: 1 1 240px; + margin: 0; + accent-color: #007bff; + } + .time-label { + min-width: 48px; + text-align: center; + color: #495057; + font-variant-numeric: tabular-nums; + } + .speed-controls { + display: flex; + gap: 8px; + margin-top: 12px; + flex-wrap: wrap; + } + .speed-controls button, + #play-toggle-btn { + margin: 0; + } + .speed-controls button.active { + background: #17a2b8; + } + @media (max-width: 900px) { + .container { + flex-direction: column; + } + #replayer { + height: 320px !important; + } + } @@ -151,6 +199,20 @@

▶️ 回放区域

+
+
+ + 00:00 + + 00:00 +
+
+ + + + +
+

🎬 回放控制

播放器提供完整控制：

@@ -163,86 +225,231 @@
- - + + -