819

src/components/newLesson/share.vue

 <template>
-  <div>
+  <div class='box'>
     <div class="share-page" id="capture">
       <div class="share-block">
         <div class="content" v-if="userDetail" ref="imageWrapper">
@@ -15,8 +15,8 @@
                 <span>家宝宝</span>
               </div>
             </div>
-            <div class="main-text">
-              <div v-if="watchDetail" class="item">
+            <div v-if="watchDetail" class="main-text">
+              <div  class="item">
                 <div class>
                   <img :src="icon_day" alt />
                 </div>
@@ -25,7 +25,7 @@
                   <span>{{watchDetail.total_day}}</span>天
                 </div>
               </div>
-              <div v-if="watchDetail" class="item">
+              <div  class="item">
                 <div class>
                   <img :src="icon_min" alt />
                 </div>
@@ -34,7 +34,7 @@
                   <span>{{minute}}</span>分钟
                 </div>
               </div>
-              <div v-if="watchDetail" class="item">
+              <div  class="item">
                 <div class>
                   <img :src="icon_baby" alt />
                 </div>
@@ -705,7 +705,7 @@ export default {
 <style lang="less">
   @import "../../util/public";
   .imgMonkey {
-    position: fixed;
+    position: absolute;
     top: 482 * @toVw;
     left: 22 * @toVw;
     z-index: 1301;
@@ -728,7 +728,7 @@ export default {
   }
 
   .imgTip {
-    position: fixed;
+    position: absolute;
     left: 86 * @toVw;
     width: 267 * @toVw;
     top: 482 * @toVw;
@@ -772,9 +772,6 @@ export default {
 @import "../../util/public";
 @tocurrentvw : 1/2 * @toVw;
 @tocurrentvh : 1/2 * @toVh;
-.test {
-  position: fixed;
-}
 .share_close {
   position: fixed;
   width: 20 * @toVw;
@@ -827,14 +824,14 @@ export default {
   }
 }
 .canvasImg {
-  position: fixed;
+  position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   z-index: 1300;
 }
 .white-pannel {
-  position: fixed;
+  position: absolute;
   z-index: 1301;
   top: 0;
   width: 100%;
@@ -846,16 +843,17 @@ export default {
   box-shadow: 0 0 0 20px white;
   box-sizing: border-box;
   .trs {
-    position: fixed;
-    top: 510 * @toVw;
-    width: 100%;
+    position: absolute;
+    top: 500 * @toVw;
+    // width: 100%;
+    left:-7 * @toVw;
+    right:-7 * @toVw;
     background: white;
-    left: 0;
     height: 30vh;
   }
 }
 .borderDiv {
-  position: fixed;
+  position: absolute;
   z-index: 1301;
   top: 0;
   width: 100%;
@@ -864,6 +862,15 @@ export default {
   box-sizing: border-box;
   border: 7 * @toVw solid white;
 }
+.box{
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  min-height:100vh;
+  z-index:1300;
+  overflow:auto;
+}
 .share-page {
   position: fixed;
   background: url("https://cdn.singsingenglish.com/new-sing/6c6766b21eceef9ddf36597efe3cc152f46ac7f0.png");

src/util/public.less

@@ -36,19 +36,19 @@ html{
   }
 }
 //滚动条样式
-::-webkit-scrollbar-track-piece { //滚动条凹槽的颜色，还可以设置边框属性
-  border-radius: 10px;
-}
-::-webkit-scrollbar {//滚动条的宽度
-  width:5px;
-  height:5px;
-}
-::-webkit-scrollbar-thumb {//滚动条的设置
-  background-color:@secondary-font-color;
-  border-radius: 10px;
-  // height: 10px;
-  min-height:10px;
-}
+// ::-webkit-scrollbar-track-piece { //滚动条凹槽的颜色，还可以设置边框属性
+//   border-radius: 10px;
+// }
+// ::-webkit-scrollbar {//滚动条的宽度
+//   width:5px;
+//   height:5px;
+// }
+// ::-webkit-scrollbar-thumb {//滚动条的设置
+//   background-color:@secondary-font-color;
+//   border-radius: 10px;
+//   // height: 10px;
+//   min-height:10px;
+// }
 // 放大缩小动画
 @-webkit-keyframes myfirst
 {