upload

public/SuperTwo/css/main.css

@@ -7194,4 +7194,19 @@ a.hasHover.tag-link:hover {
     .isHelp >div .mb{
         display: block;
     }
+
+    #play a, #pause a,#gui-modes-map div img,.backhome img,.pinBottom.right .ui-icon img{
+        width: 42px;
+        height: auto;
+    }
+
+    #play a img, #pause a img{
+        width: 100%;
+        height: 100%;
+    }
+
+    #gui-modes-map>div[rel],#play, #pause{
+        height: 48px;
+        margin: 0 5px;
+    }
 }

public/SuperTwo/css/oldVer/main0.css

@@ -151,10 +151,10 @@ iframe{
 }
 @media screen and  (max-width:667px){
 	#closepop{
-		width: 36px;
-		height: 36px;
-		top: 0px;
-		right: 0px;
+		width: 20px;
+		height: 20px;
+		top: 15px;
+		right: 15px;
 	}
 
 	#title-toggle{

public/SuperTwo/index.html

@@ -251,12 +251,12 @@
                             </a>
                         </div>
                         <div id="play" class="ui-icon" rel="tooltip" data-original-title="自动漫游" >
-                            <a>
-                                <img   src="images/play.png" >
+                            <a title="自动漫游">
+                                <img src="images/play.png" >
                             </a>
                         </div>
                         <div id="pause" class="ui-icon" style="display: none;"  >
-                            <a>
+                            <a  title="自动漫游">
                                 <img rel="tooltip" title="自动漫游" src="images/pause.png"  >
                             </a>
                         </div>
@@ -304,7 +304,7 @@
                             <div class="container"></div>
                         </div>
                         <div id="volume" class="ui-icon wide" title="音乐" >
-                            <a>
+                            <a title="音乐" >
                                 <img src="images/Volume btn_on.png">
                             </a>
                         </div>

src/components/welcome.vue

@@ -2,14 +2,13 @@
   <div class="welcome">
     <video ref="welcome" :src="require(`@/assets/videos/OPvss.mp4`)"></video>
     <div
-      v-if="showJump"
       @click="handleJump"
+      v-if="showJump"
       class="vbtn"
-      :style="{
-        backgroundImage: `url(${require(`@/assets/images/btn_bg.png`)})`,
-      }"
     >
-      <span>跳过</span>
+      <img :src="require(`@/assets/images/jump.png`)" alt="">
+      <img class="active" :src="require(`@/assets/images/jump_active.png`)" alt="">
+
     </div>
   </div>
 </template>
@@ -71,20 +70,22 @@ export default {
     position: absolute;
     bottom: 50px;
     right: 5%;
-    min-width: 315px;
-    min-height: 98px;
-    background-repeat: no-repeat;
-    background-size: 100% auto;
+    width: 80px;
     z-index: 999;
     cursor: pointer;
-    > span {
-      position: absolute;
-      transform: translate(-50%, -50%);
-      top: 46%;
-      left: 44%;
-      color: #fff;
-      font-size: 24px;
-      letter-spacing: 2px;
+    >img{
+      width: 100%;
+    }
+    .active{
+      display: none;
+    }
+    &:hover{
+      >img{
+        display: none;
+      }
+      .active{
+        display: inline-block;
+      }
     }
   }
 }
@@ -105,19 +106,9 @@ export default {
           bottom: 32px;
           left: 50%;
           transform: translateX(-50%);
-          min-width: calc(315px * 0.8);
-          min-height:  calc(98px * 0.8);
           z-index: 999;
+          width: 70px;
           cursor: pointer;
-          >span{
-            position: absolute;
-            transform: translate(-50%,-50%);
-            top: 47%;
-            left: 44%;
-            color: #fff;
-            font-size: 20px;
-            font-weight: bold;
-          }
         }
     }
 }

src/views/Home.vue

@@ -1,47 +1,59 @@
 <template>
-  <div class="home" :style="{backgroundImage:`url(${require(`@/assets/images/${$browser.mobile?(isH?'mbbg_1.jpg':'mbbg.jpg'):'bg.jpg'}`)})`}">
+  <div
+    class="home"
+    :style="{
+      backgroundImage: `url(${require(`@/assets/images/${
+        $browser.mobile ? (isH ? 'mbbg_1.jpg' : 'mbbg_1.jpg') : 'bg.jpg'
+      }`)})`,
+    }"
+  >
     <div class="title_bar" v-if="!$browser.mobile">
-      <img :src="require(`@/assets/images/title_top.png`)" alt="">
-      <img :src="require(`@/assets/images/title_bottom.png`)" alt="">
+      <img :src="require(`@/assets/images/title_top.png`)" alt="" />
+      <img :src="require(`@/assets/images/title_bottom.png`)" alt="" />
     </div>
     <div class="mb_bar" v-else>
-      <img :src="require(`@/assets/images/mb_title_top.png`)" alt="">
+      <img :src="require(`@/assets/images/mb_title_top.png`)" alt="" />
     </div>
-    <div @click="handleGoto" class="vbtn" :style="{backgroundImage:`url(${require(`@/assets/images/btn_bg.png`)})`}">
+    <div
+      @click="handleGoto"
+      class="vbtn"
+      :style="{
+        backgroundImage: `url(${require(`@/assets/images/btn_bg.png`)})`,
+      }"
+    >
       <span>点击进入</span>
     </div>
   </div>
 </template>
 
-
 <script>
-let isH = window.innerHeight/window.innerWidth
+let isH = window.innerHeight / window.innerWidth;
 export default {
-  data(){
+  data() {
     return {
-      isH: isH>1.8
-    }
+      isH: isH > 1.8,
+    };
   },
-  methods:{
-    handleGoto(){
-      this.$emit('gotoWelcome',true)
+  methods: {
+    handleGoto() {
+      this.$emit("gotoWelcome", true);
       setTimeout(() => {
-        this.$router.push({path:'/scene'})
+        this.$router.push({ path: "/scene" });
       });
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
-.home{
+.home {
   width: 100%;
   height: 100%;
   position: relative;
   background-size: 100% auto;
   background-repeat: no-repeat;
   overflow: hidden;
-  .title_bar{
+  .title_bar {
     width: 26%;
     margin-left: 4%;
     height: 100%;
@@ -50,16 +62,16 @@ export default {
     padding: 40px 0 50px;
     flex-direction: column;
     justify-content: space-between;
-    >img{
+    > img {
       max-width: 90%;
-      &:last-of-type{
+      &:last-of-type {
         margin-left: 40px;
         max-width: 80%;
       }
     }
   }
 
-  .vbtn{
+  .vbtn {
     position: absolute;
     bottom: 72px;
     transform: translateX(-50%);
@@ -70,9 +82,9 @@ export default {
     background-size: 100% auto;
     z-index: 999;
     cursor: pointer;
-    >span{
+    > span {
       position: absolute;
-      transform: translate(-50%,-50%);
+      transform: translate(-50%, -50%);
       top: 46%;
       left: 44%;
       color: #fff;
@@ -83,37 +95,51 @@ export default {
 }
 
 @media screen and (max-width: 800px) {
-    .home{
-      .mb_bar{
-        width: 100%;
-        text-align: center;
-        display: flex;
-        flex-direction: column;
-        justify-content: space-between;
-        padding-top: 40px;
-        >img{
-          width: 90%;
-          margin: 0 auto;
-        }
+  .home {
+    .mb_bar {
+      width: 100%;
+      text-align: center;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      padding-top: 40px;
+      > img {
+        width: 90%;
+        margin: 0 auto;
       }
-        .vbtn{
-          position: absolute;
-          bottom: 32px;
-          left: 50%;
-          min-width: calc(315px * 0.8);
-          min-height:  calc(98px * 0.8);
-          z-index: 999;
-          cursor: pointer;
-          >span{
-            position: absolute;
-            transform: translate(-50%,-50%);
-            top: 47%;
-            left: 44%;
-            color: #fff;
-            font-size: 20px;
-            font-weight: bold;
-          }
-        }
     }
+    .vbtn {
+      position: absolute;
+      bottom: 32px;
+      left: 50%;
+      min-width: calc(315px * 0.7);
+      min-height: calc(98px * 0.7);
+      z-index: 999;
+      cursor: pointer;
+      > span {
+        position: absolute;
+        transform: translate(-50%, -50%);
+        top: 47%;
+        left: 44%;
+        color: #fff;
+        font-size: 18px;
+        font-weight: bold;
+      }
+    }
+  }
+}
+
+@media only screen and (max-width: 320px) and (max-height: 568px) {
+  .home {
+    background-position: 0 60%;
+    .vbtn {
+      bottom: 22px;
+      min-width: calc(315px * 0.6);
+      min-height: calc(98px * 0.6);
+      > span {
+        font-size: 14px;
+      }
+    }
+  }
 }
-</style>
+</style>