fix: fix stroke animation time bug

lvdengming · Jun 21, 2024 · a9d63b5 · a9d63b5
1 parent cab0c49
commit a9d63b5
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/src/pages/12_描边动画/style.css b/src/pages/12_描边动画/style.css
@@ -4,7 +4,7 @@
 }
 
 body {
-    --animation-long-time: 3s;
+    --animation-long-time: 4s;
     --animation-short-time: 1s;
 
     display: grid;
@@ -29,7 +29,7 @@ body {
     stroke-dashoffset: var(--path-length-2);
     animation-name: stroke;
     animation-delay: var(--animation-long-time);
-    animation-duration: var(--animation-long-time);
+    animation-duration: calc(0.5 * var(--animation-long-time));
     animation-timing-function: linear;
     animation-fill-mode: forwards;
 }
@@ -38,7 +38,7 @@ body {
     stroke-dasharray: var(--path-length-3);
     stroke-dashoffset: var(--path-length-3);
     animation-name: stroke;
-    animation-delay: calc(2 * var(--animation-long-time));
+    animation-delay: calc(1.5 * var(--animation-long-time));
     animation-duration: var(--animation-short-time);
     animation-timing-function: linear;
     animation-fill-mode: forwards;
@@ -49,7 +49,7 @@ body {
     stroke-dashoffset: var(--path-length-4);
     animation-name: stroke;
     animation-delay: calc(
-        2 * var(--animation-long-time) + var(--animation-short-time)
+        1.5 * var(--animation-long-time) + var(--animation-short-time)
     );
     animation-duration: var(--animation-short-time);
     animation-timing-function: linear;