From 91cc846ad7f1d9c417260837b54fcd4bb0a0d94f Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期一, 17 六月 2024 14:51:27 +0800
Subject: [PATCH] 图书优化
---
src/books/artAndDance/view/components/chapter005.vue | 52 ++++++++++++++++++++--------------------------------
1 files changed, 20 insertions(+), 32 deletions(-)
diff --git a/src/books/artAndDance/view/components/chapter005.vue b/src/books/artAndDance/view/components/chapter005.vue
index a3560c1..e0fcfca 100644
--- a/src/books/artAndDance/view/components/chapter005.vue
+++ b/src/books/artAndDance/view/components/chapter005.vue
@@ -18,26 +18,12 @@
alt=""
class="w100 mb-40"
/>
- <div class="padding-96">
- <ul class="fl fl-cl al-cn img-state" style="margin-top: 100px">
- <li style="width: 45%">
- <img
- src="../../assets/images/crane.png"
- alt=""
- class="w100"
- :style="{ opacity: (10 - num) / 10 }"
- />
- </li>
- <li style="width: 35%">
- <img
- src="../../assets/images/rise.png"
- alt=""
- class="w100"
- :style="{ opacity: num / 10 }"
- />
- </li>
- </ul>
- <p class="img">鈥滆タ濉炲北鍓嶇櫧楣鈥濆姩浣�</p>
+ <div class="padding-96 fl ju-cn al-cn fl-cl">
+ <p class="center share-img-box">
+ <img :src="num >= 0 ? crane : rise" alt="" :style="{opacity:num >= 0 ? num / 10 : (-num) / 10 , width:num >= 0 ? '80%' : '70%'}">
+
+ </p>
+ <p class="img">鈥滆タ濉炲北鍓嶇櫧楣鈥濆姩浣�</p>
</div>
<ul class="pb-box">
<li class="ml-40">
@@ -189,6 +175,8 @@
auidoPathOne: "",
auidoPathTwo: "",
num: 0,
+ crane:require("../../assets/images/crane.png"),
+ rise:require("../../assets/images/rise.png")
};
},
unmounted() {
@@ -212,24 +200,24 @@
);
},
addNum() {
- this.addTimer = setInterval(() => {
- if (this.num < 10) {
- this.num++;
+ this.addTimer = setInterval(() => {
+ if(this.num < 10) {
+ this.num ++
} else {
- clearInterval(this.addTimer);
- this.cutNum();
+ clearInterval(this.addTimer)
+ this.cutNum()
}
- }, 200);
+ },200)
},
cutNum() {
- this.cutTimer = setInterval(() => {
- if (this.num > 0) {
- this.num--;
+ this.cutTimer = setInterval(() => {
+ if(this.num > -10) {
+ this.num --
} else {
- clearInterval(this.cutTimer);
- this.addNum();
+ clearInterval(this.cutTimer)
+ this.addNum()
}
- }, 200);
+ },200)
},
audioPlay(e) {
this.$emit('closeAudio',e.srcElement.currentSrc)
--
Gitblit v1.9.1