From 304689614daa96595aeeeed8e46e5dfa992ef2df Mon Sep 17 00:00:00 2001
From: unknown <qq1940665526@163.com>
Date: 星期一, 17 六月 2024 17:33:33 +0800
Subject: [PATCH] 优化

---
 src/books/artAndDance/view/components/chapter002.vue |   26 +++++++++++++++++---------
 1 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/books/artAndDance/view/components/chapter002.vue b/src/books/artAndDance/view/components/chapter002.vue
index 4400f7f..e3c4ee7 100644
--- a/src/books/artAndDance/view/components/chapter002.vue
+++ b/src/books/artAndDance/view/components/chapter002.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="chapter" num="3">
-    <div class="page-box" page="8" style="min-height: auto;">
+    <div class="page-box" page="8">
       <div v-if="showPageList.indexOf(8) > -1">
         <img class="img-0" alt="" src="../../assets/images/dy2.jpg" />
         <img src="../../assets/images/03-2.gif" alt="" style="width: 55%;" class="cover-gif">
@@ -17,14 +17,18 @@
           <p class="center">
             <img class="img-b" alt="" src="../../assets/images/04-2.gif" />
           </p>
-          <ul class="fl al-cn ju-bt img-state " style="margin-top: 100px;">
+          <!-- <ul class="fl al-cn ju-bt img-state " style="margin-top: 100px;">
             <li style="width: 45%;">
-              <img src="../../assets/images/05.gif" alt="" class="w100" :style="{opacity:(10 - num) / 10}">
+              <img src="../../assets/images/05.gif" alt="" class="w100" :style="{opacity:num / 10}">
             </li>
             <li style="width: 35%;">
-              <img src="../../assets/images/girl.png" alt="" class="w100" :style="{opacity: num / 10}">
+              <img src="../../assets/images/girl.png" alt="" class="w100" :style="{opacity: (-num) / 10}">
             </li>
-          </ul>
+          </ul> -->
+          <p class="center">
+            <img :src="num >= 0 ? shape : girl" alt=""  :style="{opacity:num >= 0 ? num / 10 : (-num) / 10 , width:num >= 0 ? '80%' : '34%'}">
+          </p>
+          
           <p class="img">鈥滅緤瑙掑紡鈥濊垶濮�</p>
         </div>
         <ul class="pb-box">
@@ -65,13 +69,13 @@
           <ul class="fl fl-cl al-cn audio-box">
             <li class="fl al-cn">
               <span class="wh-nr auido-text mr-8">鐢风闊�</span>
-              <audio :src="auidoPathOne" controls></audio>
+              <audio :src="auidoPathOne" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
             </li>
             <li class="fl al-cn mt-20">
               <span class="wh-nr auido-text mr-8">
                 濂崇闊�
               </span>
-              <audio :src="auidoPathTwo" controls></audio>
+              <audio :src="auidoPathTwo" controls controlslist="noplaybackrate nodownload" class="audio" @play="audioPlay"></audio>
             </li>
           </ul>
           <h3 id="c006">浜$緤琛ョ墷</h3>
@@ -191,7 +195,8 @@
       cutTimer:null,
       auidoPathOne:"",
       auidoPathTwo:"",
-
+      shape:require("../../assets/images/05.gif"),
+      girl:require("../../assets/images/girl.png")
     };
   },
   methods: {
@@ -212,13 +217,16 @@
     },
     cutNum() {
       this.cutTimer =  setInterval(() => {
-        if(this.num > 0) {
+        if(this.num > -10) {
           this.num --
         } else {
           clearInterval(this.cutTimer)
           this.addNum()
         }
       },200)
+    },
+    audioPlay(e) {
+      this.$emit('closeAudio',e.srcElement.currentSrc)
     }
   },
 };

--
Gitblit v1.9.1