javascript - 强制浏览器以纵向加载页面

Question

我需要在手机和平​​板电脑上以纵向模式显示我的页面。我怎样才能强制浏览器以这个方向加载它。或者我怎样才能完全禁用横向方向？

Answer 1

你不能强制它:(

浏览器是移动设备上的应用程序，能够横向或纵向显示。

所以:您的问题可以重新问为:“是否可以要求浏览器仅以横向模式打开？”可能某些自定义页面指令可以告诉浏览器以横向模式打开自身(搜索也许你可以在这里找到一些东西!)

但是你可以使用 css 技巧(这不是推荐的方法)，如 https://www.quora.com/Can-I-use-Javascript-to-force-a-mobile-browser-to-stay-in-portrait-or-landscape-mode 中提到的。

这个想法是在所有页面内容上使用CSS旋转

@media screen and (orientation:landscape) {
  //set you content id
  #container {
    -ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
    transform: rotate(-90deg);
    width: /* screen width */ ;
    height: /* screen height */ ;
    overflow: scroll;
  }
}

---

我推荐 forcing web-site to show in landscape mode only 中提到的解决方案它轻轻地要求用户旋转浏览器(@JasonSebring)

<style type="text/css">
    #warning-message { display: none; }
    @media only screen and (orientation:portrait){
        #wrapper { display:none; }
        #warning-message { display:block; }
    }
    @media only screen and (orientation:landscape){
        #warning-message { display:none; }
    }
</style>

....

<div id="wrapper">
    <!-- your html for your website -->
</div>
<div id="warning-message">
    this website is only viewable in landscape mode
</div>