lanxin
/
Chengzhebei


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
							<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Chenzhebei-ShanxiMuseum</title>
    <link rel="shortcut icon" href="TemplateData/favicon.ico">
      <style>
        * {
          margin: 0;
          padding: 0;
          box-sizing: border-box;
        }

        body {
          overflow: hidden;
        }

        .root {
          position: absolute;
        }

        iframe {
          width: 100%;
          height: 100%;
        }

        @media all and (orientation: landscape) {
          .landscape {
            transform: rotate(0deg);
            width: 100vw;
            width: 100dvw;
            height: 100vh;
            height: 100dvh;
            top: 0;
            left: 0;
          }
          .portrait {
            transform: rotate(90deg);
            transform-origin: left top;
            width: 100vh;
            width: 100dvh;
            height: 100vw;
            height: 100dvw;
            left: 100%;
          }
        }
        
        @media all and (orientation: portrait) {
          .landscape {
            transform: rotate(90deg);
            transform-origin: left top;
            width: 100vh;
            width: 100dvh;
            height: 100vw;
            height: 100dvw;
            left: 100%;
          }
          .portrait {
            transform: rotate(0deg);
            width: 100vw;
            width: 100dvw;
            height: 100vh;
            height: 100dvh;
            top: 0;
            left: 0;
          }
        }
      </style>
  </head>
  <body>
    <div class="root">
      <iframe
        id="main"
        frameborder="0">
      </iframe>
    </div>
  </body>
  <script>
    const rootDom = document.querySelector('.root')
    const iframe = document.querySelector('#main')
    let isPortrait = false;

    function internal_ChangeViewType(portrait){
      if(portrait){
        rootDom.classList.remove('landscape');
        rootDom.classList.add('portrait');
      }else{
        rootDom.classList.add('landscape');
        rootDom.classList.remove('portrait');
      }
    }
    
    window.changeViewType = function(landscape){
      if (isPortrait !== landscape){
        isPortrait = landscape;
        internal_ChangeViewType(landscape);
      }
    }
    internal_ChangeViewType(isPortrait);
    
    window.onUnityClickBack = function () {
        if (window.parent && window.parent !== window) {
            window.parent.onUnityClickBack();
        }
    }
    
    iframe.src = "./main.html"
  </script>
</html>