Explorar el Código

热点样式调整

lanxin hace 6 días
padre
commit
9bb4314c93

+ 5 - 1
Hot/src/assets/base.css

@@ -25,7 +25,11 @@ body {
 .viewer-close {
   display: none !important;
 }
-
+.viewer-canvas {
+  & > img {
+    pointer-events: none;
+  }
+}
 @media screen and (max-width: 800px) {
   .viewer-footer {
     bottom: auto;

+ 7 - 4
Hot/src/views/Home.vue

@@ -29,8 +29,8 @@
               </div>
               <!-- 图片页面 -->
               <div class="imgBox" v-else-if="myType === 'img'">
-                <div class="smImgBox">
-                  <img v-lazy="urlToFitFu(item)" alt="" @click="lookImg(urlToFitFu(item))" />
+                <div class="smImgBox" @click="lookImg(urlToFitFu(item))">
+                  <img v-lazy="urlToFitFu(item)" alt="" />
                 </div>
               </div>
             </div>
@@ -311,6 +311,7 @@ export default {
       font-weight: 700;
       margin-bottom: 20px;
       letter-spacing: 4px;
+      padding: 0 30px;
       padding-bottom: 8px;
       color: #4b4b4b;
       position: relative;
@@ -323,7 +324,8 @@ export default {
         position: absolute;
         z-index: -1;
         bottom: 0;
-        left: 0;
+        left: 30px;
+
         width: 250px;
         height: 20px;
         background: rgba(196, 182, 160, 0.8);
@@ -396,6 +398,7 @@ export default {
             & > img {
               width: 100%;
               height: 100%;
+              pointer-events: none;
               object-fit: contain;
             }
           }
@@ -597,7 +600,7 @@ export default {
           margin-top: 0;
           width: 100%;
           padding: 10px 30px 0px 30px;
-          max-height: 170px;
+          max-height: 80%;
 
           .flooTxtBox {
             padding: 0;

+ 2 - 2
Scene/public/css/oldVer/main0.css

@@ -235,8 +235,8 @@ a {
     width: 30px;
     height: 30px;
     position: absolute;
-    top: 38px;
-    right: 25px;
+    top: 80px;
+    right: 34px;
   }
 
   #title-toggle {

+ 27 - 23
Scene/public/js/Hot.js

@@ -429,7 +429,7 @@ window.initHot = function (model) {
         {
           let action = CloneObject(settings.hotClickEvent.shine)
           if (info.actionType == 'noAction' || info.noAction) {
-            ;(action.examine = false), (action.openHot = false)
+            ;((action.examine = false), (action.openHot = false))
           } else if (info.actionType == 'dontExam') {
             action.examine = false
           }
@@ -920,21 +920,24 @@ window.initHot = function (model) {
       }
       const minPlayedTime = Math.min(video.duration / 10, 0.1) //到这个时间说明加载成功
       if (!video.hasInitedOpacity) {
-        setTimeout(e => {
-          //console.log('trychangeOpa ',this.sid,video.currentTime)
-          if (video.currentTime > minPlayedTime) {
-            this.material_.opacity = 1
-            video.hasInitedOpacity = true
-            //console.log('changeOpaWhenPlay',this.sid)
-          } else {
-            if (!video.paused) {
-              //再次尝试
-              return setTimeout(() => {
-                this.changeOpaWhenPlay(video)
-              }, 500)
+        setTimeout(
+          e => {
+            //console.log('trychangeOpa ',this.sid,video.currentTime)
+            if (video.currentTime > minPlayedTime) {
+              this.material_.opacity = 1
+              video.hasInitedOpacity = true
+              //console.log('changeOpaWhenPlay',this.sid)
+            } else {
+              if (!video.paused) {
+                //再次尝试
+                return setTimeout(() => {
+                  this.changeOpaWhenPlay(video)
+                }, 500)
+              }
             }
-          }
-        }, minPlayedTime * 1000 + 500)
+          },
+          minPlayedTime * 1000 + 500
+        )
       }
     }
 
@@ -1135,29 +1138,29 @@ window.initHot = function (model) {
       var popup = document.getElementById('popup')
 
       if (openHot) {
-        ;(g_currentHot = this), (popup.style.display = 'block'), popup.classList.add('wait')
+        ;((g_currentHot = this), (popup.style.display = 'block'), popup.classList.add('wait'))
         var n = document.createElement('iframe')
 
         SoundManager.play('hot')
 
         var src = getLink(this.info.link)
         n.src = src
-        ;(n.id = 'id1'), (n.allowTransparency = 'true')
+        ;((n.id = 'id1'), (n.allowTransparency = 'true'))
         var a = document.getElementById('id1')
         if (void 0 === a || null == a) {
           document.querySelector('.popup-content').appendChild(n)
           var s = !1
-          ;(window.loaddingSuccess = function () {
+          ;((window.loaddingSuccess = function () {
             s = !0
           }),
             setTimeout(function e() {
               if (s) {
                 var t = document.querySelector('#id1').contentWindow.document
-                t.querySelector('video') &&
+                ;(t.querySelector('video') &&
                   (t.querySelector('video').play(), !t.querySelector('video').paused && t.querySelector('.playPause') && t.querySelector('.playPause').classList.add('fa-pause')),
-                  t.querySelector('audio') && t.querySelector('audio').play()
+                  t.querySelector('audio') && t.querySelector('audio').play())
               } else setTimeout(e, 300)
-            }, 800)
+            }, 800))
         }
       }
 
@@ -1203,7 +1206,7 @@ window.initHot = function (model) {
           var f = new THREE.Matrix4().lookAt(c.position, h, new THREE.Vector3(0, 1, 0))
           p.quaternion = new THREE.Quaternion().setFromRotationMatrix(f)
         }
-        ;(p.callback = done), (p.duration = options.duration || 1500), (p.mode = 'panorama'), (p.aimDuration = options.aimDuration)
+        ;((p.callback = done), (p.duration = options.duration || 1500), (p.mode = 'panorama'), (p.aimDuration = options.aimDuration))
         player.flyToNewMode(p)
       }
     }
@@ -1542,7 +1545,8 @@ window.initHot = function (model) {
     originModelCount = hotGroup.children.filter(e => !!e.info.objSrc).length
     if (originPhotoCount == 0) Hot.allPhotoLoaded = true
     if (originModelCount == 0) Hot.allModelLoaded = true
-    if (Hot.allModelLoaded && Hot.allPhotoLoaded) Hot.whenAllFileLoaded && Hot.whenAllFileLoaded() //所有加载完毕
+    if (Hot.allModelLoaded && Hot.allPhotoLoaded)
+      Hot.whenAllFileLoaded && Hot.whenAllFileLoaded() //所有加载完毕
     else {
       Hot.load()
     }

+ 4 - 2
Scene/src/pages/A2main/index.module.scss

@@ -179,7 +179,7 @@
     #thumb-container {
       width: 100% !important;
       display: flex;
-      justify-content: flex-start;
+      justify-content: center;
       align-items: center;
       gap: 10px;
       .thumbImg {
@@ -338,7 +338,9 @@
         top: 24px;
         font-size: 10px;
         color: #fff;
-        text-shadow: 0 0 5px rgba(253, 251, 178, 0.8), 0 0 10px rgba(253, 251, 178, 0.6);
+        text-shadow:
+          0 0 5px rgba(253, 251, 178, 0.8),
+          0 0 10px rgba(253, 251, 178, 0.6);
       }
       #gui-modes-map {
         border-radius: 25px;