首页 发现 帮助
登录
yonge
/
colexiu-website
2
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

12/21

滚动bug优化
mo 4 年之前
父节点
a003f6a32d
当前提交
e7e3761408
共有 10 个文件被更改，包括 114 次插入 和 78 次删除
合并视图 显示文件统计
  1. 1 1
      dist/index.html
  2. 0 0
      dist/static/css/app.0a403418ff7596ecbc446dac7d9086ef.css
  3. 0 0
      dist/static/css/app.0a403418ff7596ecbc446dac7d9086ef.css.map
  4. 0 0
      dist/static/js/app.9bbc2167470d10e9eb40.js
  5. 0 0
      dist/static/js/app.9bbc2167470d10e9eb40.js.map
  6. 0 0
      dist/static/js/app.e8101d8492ad85eb8463.js
  7. 0 0
      dist/static/js/app.e8101d8492ad85eb8463.js.map
  8. 0 0
      dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map
  9. 113 75
      src/components/headerSection.vue
  10. 0 2
      src/components/silder.vue

+ 1 - 1
dist/index.html
查看文件 

@@ -1 +1 @@
 
-<!DOCTYPE html><html lang=zh-CN><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta name=theme-color content=#000000><meta name=description content=酷乐秀是一个专注于音乐类在线教育领域的平台，致力于打造新一代云教育体系，突破教育资源，地域限制等因素的影响，为“教”“学”两端提供专业服务。><title>酷乐秀官方网站</title><link rel="shortcut icon" href=./favicon.ico><link href=./static/css/app.b5323417cc6014067adf4c4a1e4c7615.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.af7ddee87b13e4395b52.js></script><script type=text/javascript src=./static/js/app.e8101d8492ad85eb8463.js></script></body></html>
 
+<!DOCTYPE html><html lang=zh-CN><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta name=theme-color content=#000000><meta name=description content=酷乐秀是一个专注于音乐类在线教育领域的平台，致力于打造新一代云教育体系，突破教育资源，地域限制等因素的影响，为“教”“学”两端提供专业服务。><title>酷乐秀官方网站</title><link rel="shortcut icon" href=./favicon.ico><link href=./static/css/app.0a403418ff7596ecbc446dac7d9086ef.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.af7ddee87b13e4395b52.js></script><script type=text/javascript src=./static/js/app.9bbc2167470d10e9eb40.js></script></body></html>

文件差异内容过多而无法显示
+ 0 - 0
dist/static/css/app.0a403418ff7596ecbc446dac7d9086ef.css


文件差异内容过多而无法显示
+ 0 - 0
dist/static/css/app.0a403418ff7596ecbc446dac7d9086ef.css.map


文件差异内容过多而无法显示
+ 0 - 0
dist/static/js/app.9bbc2167470d10e9eb40.js


文件差异内容过多而无法显示
+ 0 - 0
dist/static/js/app.9bbc2167470d10e9eb40.js.map


文件差异内容过多而无法显示
+ 0 - 0
dist/static/js/app.e8101d8492ad85eb8463.js


文件差异内容过多而无法显示
+ 0 - 0
dist/static/js/app.e8101d8492ad85eb8463.js.map


文件差异内容过多而无法显示
+ 0 - 0
dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map


+ 113 - 75
src/components/headerSection.vue
查看文件 

@@ -1,112 +1,150 @@
 
 <template>
 
 <template>
 
   <div class="headerSection">
 
   <div class="headerSection">
 
     <div class="header-container width1200">
 
     <div class="header-container width1200">
 
-      <router-link :to="{ path: '/' }"
 
-                   class="logo">
 
-        <img src="../assets/images/logoWhile.png"
 
-             width="100%"
 
-             alt="">
 
+      <router-link :to="{ path: '/' }" class="logo">
 
+        <img src="../assets/images/logoWhile.png" width="100%" alt="" />
 
       </router-link>
 
       </router-link>
 
       <div class="menu">
 
       <div class="menu">
 
-        <a :class="checkActive==1?'active':''"
 
-           @click="change(1,'banner')">平台介绍</a>
 
-        <a :class="checkActive==2?'active':''"
 
-           @click="change(2,'infos')">产品优势</a>
 
-        <a :class="checkActive==3?'active':''"
 
-           @click="change(3,'detail')">考生指引</a>
 
-        <a :class="checkActive==4?'active':''"
 
-           @click="change(4,'videoList')">操作指南</a>
 
-        <a :class="checkActive==5?'active':''"
 
-           @click="change(5,'consult')">行业资讯</a>
 
-        <a :class="checkActive==6?'active':''"
 
-           @click="change(6,'aboutUs')">关于我们</a>
 
-        <div class="bandBtn"
 
-             @click="goKu">合作机构登录</div>
 
+        <a
 
+          :class="checkActive == 1 ? 'active' : ''"
 
+          @click="change(1, 'banner')"
 
+          >平台介绍</a
 
+        >
 
+        <a :class="checkActive == 2 ? 'active' : ''" @click="change(2, 'infos')"
 
+          >产品优势</a
 
+        >
 
+        <a
 
+          :class="checkActive == 3 ? 'active' : ''"
 
+          @click="change(3, 'detail')"
 
+          >考生指引</a
 
+        >
 
+        <a
 
+          :class="checkActive == 4 ? 'active' : ''"
 
+          @click="change(4, 'videoList')"
 
+          >操作指南</a
 
+        >
 
+        <a
 
+          :class="checkActive == 5 ? 'active' : ''"
 
+          @click="change(5, 'consult')"
 
+          >行业资讯</a
 
+        >
 
+        <a
 
+          :class="checkActive == 6 ? 'active' : ''"
 
+          @click="change(6, 'aboutUs')"
 
+          >关于我们</a
 
+        >
 
+        <div class="bandBtn" @click="goKu">合作机构登录</div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
 </template>
 
 </template>
 
 <script>
 
 <script>
 
-import Bus from '../views/index/blocks/eventBus'
 
-import { scrollAnimation } from '@/util/scroll'
 
+import Bus from "../views/index/blocks/eventBus";
 
+import { scrollAnimation } from "@/util/scroll";
 
 export default {
 
 export default {
 
-  name: 'headerSection',
 
-  props: ['name'],
 
-  data () {
 
+  name: "headerSection",
 
+  props: ["name"],
 
+  data() {
 
     return {
 
     return {
 
       checkActive: 1,
 
       checkActive: 1,
 
-      topList: []
 
-    }
 
-  },
 
-  created () {
 
-
 
+      topList: [],
 
+    };
 
   },
 
   },
 
-  mounted () {
 
+  created() {},
 
+  mounted() {
 
     scrollTo(0, 0);
 
     scrollTo(0, 0);
 
-    let url = this.$route
 
-    if (url.path.indexOf('detile') != -1) {
 
-      this.checkActive = 5
 
+    let url = this.$route;
 
+    if (url.path.indexOf("detile") != -1) {
 
+      this.checkActive = 5;
 
     }
 
     }
 
-    this.$nextTick(res => {
 
-      this.topList = this.getTop(['banner', 'infos', 'detail', 'videoList', 'consult', 'aboutUs'])
 
-    })
 
+    this.$nextTick((res) => {
 
+      this.topList = this.getTop([
 
+        "banner",
 
+        "infos",
 
+        "detail",
 
+        "videoList",
 
+        "consult",
 
+        "aboutUs",
 
+      ]);
 
+    });
 
 
 
-    window.addEventListener('scroll', this.onContentScroll, true)
 
-    Bus.$on('gotoDetail', (res => {
 
+    window.addEventListener(
 
+      "scroll",
 
+        this.onContentScroll,
 
+      true
 
+    );
 
+    Bus.$on("gotoDetail", (res) => {
 
       // 控制页面滚动
 
       // 控制页面滚动
 
-      this.change(3, 'detail')
 
-    }))
 
+      this.change(3, "detail");
 
+    });
 
   },
 
   },
 
   methods: {
 
   methods: {
 
-    getTop (nameList) {
 
-      let arr = []
 
-      nameList.forEach(item => {
 
-        let top = document.getElementById(item).offsetTop - 78
 
-        arr.push(top)
 
-      })
 
-      arr.sort(function (a, b) { return a - b });
 
-      return arr
 
+    getTop(nameList) {
 
+      let arr = [];
 
+      nameList.forEach((item) => {
 
+        let top = document.getElementById(item).offsetTop - 78;
 
+        arr.push(top);
 
+      });
 
+      arr.sort(function (a, b) {
 
+        return a - b;
 
+      });
 
+      return arr;
 
     },
 
     },
 
-    change (num, name) {
 
-      let url = this.$route.path
 
-      let top = document.getElementById(name).offsetTop - 76
 
-      const currentY = document.documentElement.scrollTop || document.body.scrollTop
 
-      if (url != '/') {
 
-        this.$router.push('/')
 
+    change(num, name) {
 
+      let url = this.$route.path;
 
+      let top = document.getElementById(name).offsetTop - 76;
 
+      const currentY =
 
+        document.documentElement.scrollTop || document.body.scrollTop;
 
+      if (url != "/") {
 
+        this.$router.push("/");
 
         this.checkActive = num;
 
         this.checkActive = num;
 
 
 
-        scrollAnimation(currentY, top)
 
+        scrollAnimation(currentY, top);
 
         // scrollTo(0, top);
 
         // scrollTo(0, top);
 
       } else {
 
       } else {
 
         this.checkActive = num;
 
         this.checkActive = num;
 
-        scrollAnimation(currentY, top)
 
+        scrollAnimation(currentY, top);
 
         // scrollTo(0, top);
 
         // scrollTo(0, top);
 
       }
 
       }
 
     },
 
     },
 
-    goKu () {
 
-      window.open('https://kj.colexiu.com/#/login?returnUrl=%2F', '_blank');
 
+    goKu() {
 
+      window.open("https://kj.colexiu.com/#/login?returnUrl=%2F", "_blank");
 
     },
 
     },
 
 
 
-    onContentScroll (e) {
 
+    onContentScroll(e) {
 
       // this.topList = this.getTop(['banner', 'infos', 'detail', 'videoList', 'consult', 'aboutUs'])
 
       // this.topList = this.getTop(['banner', 'infos', 'detail', 'videoList', 'consult', 'aboutUs'])
 
-      let target = e.target || e.srcElement
 
-      this.scrollTop = target.scrollingElement.scrollTop
 
-      if (this.scrollTop < this.topList[1]) {
 
-        this.checkActive = 1
 
-      } else if (this.scrollTop >= this.topList[1] && this.scrollTop < this.topList[2]) {
 
-        this.checkActive = 2
 
-      } else if (this.scrollTop >= this.topList[2] && this.scrollTop < this.topList[3]) {
 
-        this.checkActive = 3
 
-      } else if (this.scrollTop >= this.topList[3] && this.scrollTop < this.topList[4]) {
 
-        this.checkActive = 4
 
-      } else if (this.scrollTop >= this.topList[4] && this.scrollTop < this.topList[5]) {
 
-        this.checkActive = 5
 
-      } else if (this.scrollTop >= this.topList[5]) {
 
-        this.checkActive = 6
 
+      let target = e.target || e.srcElement;
 
+      if (target&&target.scrollingElement) {
 
+        this.scrollTop = target.scrollingElement.scrollTop;
 
+        if (this.scrollTop < this.topList[1]) {
 
+          this.checkActive = 1;
 
+        } else if (
 
+          this.scrollTop >= this.topList[1] &&
 
+          this.scrollTop < this.topList[2]
 
+        ) {
 
+          this.checkActive = 2;
 
+        } else if (
 
+          this.scrollTop >= this.topList[2] &&
 
+          this.scrollTop < this.topList[3]
 
+        ) {
 
+          this.checkActive = 3;
 
+        } else if (
 
+          this.scrollTop >= this.topList[3] &&
 
+          this.scrollTop < this.topList[4]
 
+        ) {
 
+          this.checkActive = 4;
 
+        } else if (
 
+          this.scrollTop >= this.topList[4] &&
 
+          this.scrollTop < this.topList[5]
 
+        ) {
 
+          this.checkActive = 5;
 
+        } else if (this.scrollTop >= this.topList[5]) {
 
+          this.checkActive = 6;
 
+        }
 
       }
 
       }
 
     },
 
     },
 
-  }
 
-}
 
+  },
 
+};
 
 </script>
 
 </script>
 
 
 
 <style lang="less" scoped>
 
 <style lang="less" scoped>

+ 0 - 2
src/components/silder.vue
查看文件 

@@ -164,8 +164,6 @@ export default {
 
        if(location.hostname == 'colexiu.com'){
 
        if(location.hostname == 'colexiu.com'){
 
          url = 'https://kj.colexiu.com/'
 
          url = 'https://kj.colexiu.com/'
 
        }
 
        }
 
-       console.log(location.hostname)
 
-       return
 
       this.$refs["form"].validate((res) => {
 
       this.$refs["form"].validate((res) => {
 
         if (res) {
 
         if (res) {
 
           console.log("发送请求");
 
           console.log("发送请求");

部分文件因为文件数量过多而无法显示