dos

Public/static/css/index.css

@@ -79,4 +79,33 @@ body {
   transform: translate(0, -50%); */
   overflow: unset;
   display: none;
+}
+
+.point {
+  animation: point 2.5s linear infinite;
+  -webkit-animation: point 2.5s linear infinite;
+}
+
+@keyframes point {
+
+  0%,
+  100% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0.3;
+  }
+}
+
+@-webkit-keyframes point {
+
+  0%,
+  100% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0.3;
+  }
 }
\ No newline at end of file

Public/static/js/common.js

@@ -55,6 +55,8 @@ var fireworkLock = false;
 
 let posterCanvas, posterCtx;
 
+let scrollTimer, showTitleStatus = false;
+
 const guardian = [
     '事事顺意守',
     '健康祈愿守',
@@ -82,6 +84,8 @@ $(document).ready(function () {
         window.scroll(0, 0); //失焦后强制让页面归位
     });
 
+    $('.container').on('scroll', showTitle)
+
     $('.page1 .btn-next').on('click', toPage2);
     $('.page2 .btn-next').on('click', toPage3);
 
@@ -101,6 +105,22 @@ $(document).ready(function () {
     $('.btn-retry').on('click', retry)
 });
 
+function showTitle() {
+    if (!showTitleStatus) {
+        return false;
+    }
+    if (scrollTimer !== null) {
+        clearTimeout(scrollTimer)
+    }
+    scrollTimer = setTimeout(() => {
+        const scrollTop = $('.container').scrollTop();
+        if (scrollTop > 700) {
+            $('.title').show();
+            showTitleStatus = true;
+        }
+    }, 100)
+}
+
 
 function toscene(event) {
     const scene = event.data.scene;
@@ -131,6 +151,8 @@ function retry() {
     $('.page1').show();
     fireworkLock = false
     updateWorld()
+    showTitleStatus = false
+    $('.title').hide()
 }
 
 function createPoster(resultFlag) {