author scroll status

@@ -25,9 +25,10 @@
       class="main-container"
       ref="scroll"
       :options="scrollOpts"
-      :scroll-events="['scroll', 'scroll-end']"
+      :scroll-events="['scroll', 'scroll-end', 'before-scroll-start']"
       @scroll="onScrollHandle"
-      @scroll-end="onScrollEndHandle">
+      @scroll-end="onScrollEndHandle"
+      @before-scroll-start="beforeScrollStartHandle">
       <div ref="authorProfile" class="author-profile">
         <span class="avatar-box">
           <WidgetAvatar :src="authorBaseData.headIco" :width="100" :height="100"></WidgetAvatar>
@@ -59,7 +60,7 @@
       </div>
     </cube-scroll>
 
-    <a v-if="isOwner" class="publish hover-opacity" :href="publishUrl"></a>
+    <a v-if="isOwner" class="publish hover-opacity" :class="{'scroll-opacity': scrolling}" :href="publishUrl"></a>
   </Layout>
 </template>
 
@@ -78,6 +79,7 @@
     data() {
       return {
         scrollY: 0,
+        scrolling: false,
         mineInfoUrl: '//m.yohobuy.com/home/mydetails?openby:yohobuy＝{"action":"go.mineinfo"}',
         publishUrl: '?openby:yohobuy＝{"action":"go.grasspublish"}',
         autherInfo: {},
@@ -238,6 +240,7 @@
         this._animePlayed = animePlayed;
       },
       onScrollEndHandle(scroll) {
+        this.scrolling = false;
         if (1000 - scroll.y > this.$refs.contantList.offsetHeight) {
           this._listTimer && clearTimeout(this._listTimer);
           this._listTimer = setTimeout(() => {
@@ -245,6 +248,9 @@
           }, 50);
         }
       },
+      beforeScrollStartHandle() {
+        this.scrolling = true;
+      },
       changeTab(index) {
         if (this.activeIndex !== index) {
           this.activeIndex = index;
@@ -580,5 +586,10 @@
     background-image: url('../../statics/image/userpage/publish.png');
     background-size: 100% 100%;
     z-index: 10;
+    transition: all 600ms ease-in-out;
+
+    &.scroll-opacity {
+      opacity: 0.3;
+    }
   }
 </style>