feat

play/index.css

@@ -98,7 +98,7 @@ body {
 
 .highlight-rect {
   position: absolute;
-  border: 2px dashed #007bff;
+  border-bottom: 3px solid #3e98e7;
   background-color: transparent;
   pointer-events: none;
   z-index: 15;
@@ -107,13 +107,13 @@ body {
 
 .word-highlight {
   position: absolute;
-  background-color: rgba(255, 235, 59, 0.2);
-  border: 1px solid #f57f17;
-  border-radius: 3px;
+  background-color: rgba(225,96,239, 0.3);
+  /* border: 1px solid #f57f17; */
+  border-radius: 5px;
   pointer-events: none;
   z-index: 1;
   transition: all 0.2s ease;
-  box-shadow: 0 0 5px rgba(255, 235, 59, 0.5);
+  box-shadow: 0 0 5px rgba(225,96,239, 0.5);
 }
 
 .controls {

play/index.js

@@ -405,7 +405,11 @@ function initializeApp(data) {
         const newRects = [];
         const newWords = [];
 
-        // 检查是否在当前页的时间范围内
+        // 检查是否在当前页的时间范围内；若不在，则保留当前高亮，等待实际翻页时再清除
+        if (currentTime < this.currentPageStartTime || currentTime > this.currentPageEndTime) {
+          return;
+        }
+
         if (currentTime >= this.currentPageStartTime && currentTime <= this.currentPageEndTime) {
           // 使用计算属性获取所有矩形框和单词数据
           const allRects = this.currentPageRects;