【问题标题】:Redirect to mobile page when width is too small宽度太小时重定向到移动页面
【发布时间】:2012-10-23 10:34:07
【问题描述】:

由于我的网站在小屏幕上看起来一点都不好看,所以我想创建一个 JS 函数,当屏幕宽度小于或等于 800 像素时将我重定向到移动版页面。

这里是它的代码:

if (screen.width <= 800) {
  document.location ="index_mobile.html";
};

如果代码有效,那么当我将浏览器窗口缩小到 800 像素宽时,应该会显示 index_mobile.html。但它现在没有出现。有谁知道怎么回事?

http://jsfiddle.net/RZMmV/

【问题讨论】:

  • 如果这是专门针对您网站的移动版本的,有better 的方法。

标签: javascript html redirect


【解决方案1】:

移动浏览器不会报告或使用真实设备分辨率,因为这会使互联网上的所有网站基本上都无法使用。

他们所做的是创建一个“虚拟屏幕”,其分辨率接近桌面 PC 的分辨率,然后在页面上实现缩放。

如果您想知道真实的设备分辨率,您需要禁用在设备上完成的自动缩放。例如,对于 iOS 和 Android 设备,可以添加

<meta name="viewport"
      content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>

到您页面的&lt;head&gt; 部分。这会通知浏览器该页面是为处理低分辨率设备而设计的,并禁用虚拟屏幕层。

【讨论】:

    【解决方案2】:

    screen.width 将返回显示器的宽度,而不是窗口的宽度,因此您不能只是缩小浏览器窗口以获得不同的值。为此,您需要使用 window.outerWidth 或其他东西。

    【讨论】:

      猜你喜欢
      • 2011-07-11
      • 1970-01-01
      • 1970-01-01
      • 2019-10-21
      • 2014-06-10
      • 1970-01-01
      • 1970-01-01
      • 2011-06-29
      • 1970-01-01
      相关资源
      最近更新 更多