123

index.html

@@ -28,7 +28,7 @@
         }
 
         @media screen and (orientation: portrait){
-          #renderCanvas{  
+          /* #renderCanvas{  
             position:absolute;
             width: 100vh;
             height: 100vw;
@@ -39,16 +39,16 @@
             -ms-transform: rotate(90deg);
             transform:rotate(90deg);
             transform-origin: 0% 0%;
-          }  
+          }   */
         }
         @media screen and (orientation: landscape) {
-          #renderCanvas {
+          /* #renderCanvas {
             position:absolute;
             top:0;
             left:0;
             width: 100vw;
             height: 100vh;
-          }
+          } */
         }
       </style>
     </head>
@@ -75,7 +75,7 @@
         top: 0;
         left: 0;
       ">
-        <button id = "enterBtn">点击进入</button>
+        <!-- <button id = "enterBtn">点击进入</button> -->
       </div>
       <canvas id="renderCanvas"></canvas>
 
@@ -98,6 +98,10 @@
           crossorigin="anonymous"
           preload="auto"
           playsinline="true" 
+          x5-playsinline="true" 
+          webkit-playsinline="true" 
+          x5-video-player-type="h5" 
+          controls="true" 
           muted
           loop
         ></video>
@@ -107,6 +111,10 @@
           crossorigin="anonymous"
           preload="auto"
           playsinline="true" 
+          x5-playsinline="true" 
+          webkit-playsinline="true" 
+          x5-video-player-type="h5" 
+          controls="true" 
           muted
           loop
         ></video>

modules/index.js

@@ -33,15 +33,26 @@ export default class App {
 
         this.hasVideoTexture = true
 
-        document.getElementById("enterBtn").onclick = () => {
-            this.init()
-            this.bindEvents()
-            setTimeout(() => this.bindSocketEvents(), 1000)
-        }
+        this.init()
+        this.bindEvents()
+        setTimeout(() => this.bindSocketEvents(), 1000)
+
+        // document.getElementById("enterBtn").onclick = () => {
+        //     document.getElementById("houseTexture").play();
+        //     document.getElementById("houseTextureReverse").play();
+            // document.getElementById("mask").style.zIndex = "-10000"
+        // }
     }
 
     init() {
 
+        // document.getElementById("houseTexture").onplay = () => {
+        //     console.error("video play!")
+        // }
+        // window.ty =()=>{
+        //     document.getElementById("houseTexture").play();
+        // }
+
         this.initVideo = true
         this.isReverse = false