浏览代码

feat: 导览按钮

chenlei 2 年之前
父节点
当前提交
7b317bc598
共有 3 个文件被更改,包括 34 次插入9 次删除
  1. 13 3
      scene/public/static/js/main_2020_show.js
  2. 二进制
      scene/src/assets/img/m_btn.png
  3. 21 6
      scene/src/views/gui/menu.vue

+ 13 - 3
scene/public/static/js/main_2020_show.js

@@ -6656,9 +6656,19 @@ window.Modernizr = function(n, e, t) {
                 }),
 
                 // 手动触发 导览列表点击
-                $("#myClickBox").on('click',function(){
-                    // 改第一个0,为索引值
-                    t.goToHighlight([5,0])
+                $("#myClickBox #go").on('click',function(){
+                    const imgActIndex = $(".thumbImg.active").data('index')
+                    const curIndex = typeof imgActIndex === 'number' ? imgActIndex : -1;
+                    const nextIndex = Number(curIndex) + 1;
+                    if (nextIndex >= Fe) return
+                    t.goToHighlight([nextIndex,0])
+                })
+                $("#myClickBox #back").on('click',function(){
+                    const imgActIndex = $(".thumbImg.active").data('index')
+                    const curIndex = typeof imgActIndex === 'number' ? imgActIndex : -1;
+                    const nextIndex = Number(curIndex) - 1;
+                    if (nextIndex < 0) return
+                    t.goToHighlight([nextIndex,0])
                 })
 
                 $(".previous").find("a").on("click", function(e) {

二进制
scene/src/assets/img/m_btn.png


+ 21 - 6
scene/src/views/gui/menu.vue

@@ -4,6 +4,11 @@
       <div id="view-controllers"></div>
     </div>
     <div class="pinBottom left">
+      <div v-if="isMobile" id='myClickBox' style="">
+        <div id="go" />
+        <div id="back" />
+      </div>
+
       <div>
         <div class="viewContainer">
           <div
@@ -259,8 +264,6 @@
     </div>
     <!-- 手动触发导览 -->
 
-    <div id='myClickBox' style="">6666</div>
-
   </div>
 </template>
 
@@ -529,11 +532,23 @@ export default {
   }
 }
 #myClickBox{
+  display: flex;
+  flex-direction: column;
   position: fixed;
   z-index: 999;
-  top: 50px;
-  left: 50px;
-  background-color: red;
-  color: #fff;
+  left: 50%;
+  bottom: 38px;
+  width: 146px;
+  height: 146px;
+  transform: translateX(-50%);
+  background: url('../../assets/img/m_btn.png') no-repeat center / contain;
+  transition: .2s bottom linear;
+
+  > div {
+    flex: 1;
+  }
+}
+.pinBottom.open #myClickBox {
+  bottom: calc(118px + 20px);
 }
 </style>