3

是否有用于 HTML 5 解释器（又名网络浏览器）的定向设备模拟器/模拟器？

我正在使用 HTML 5 中的DeviceOrientation 事件规范，我可以编写一个在我的 Android 智能手机浏览器中运行的示例。

但是，在开发阶段，我想直接在我的 PC 上工作以尝试代码，并且我正在寻找一个设备方向模拟器。

对于 Android，我找到了 OpenIntents Sensor Simulator，它没有用，因为您需要在应用程序中包含特殊的 Java 代码，因此它在 Web 浏览器中不可用（除非您使用一些特殊的）。是否有任何其他适用于 Android 的设备模拟器直接在浏览器中运行？

我也找不到任何 Firefox 模拟器。

还有其他解决方案吗？

4

3 回答 3

8

那么在 Chrome 中有这个

在此处输入图像描述

非动画版：

  1. 从汉堡菜单打开开发者工具
  2. 按 ESC 或单击>_图标
  3. 选择仿真选项卡
  4. 点击电话图标　

请注意，Chrome 的 devtools 仿真显然存在一些问题，因此还有这个设备方向仿真库。

于 2015-06-09T07:49:05.660 回答
1

但是，在开发阶段，我想直接在我的 PC 上工作以尝试代码，并且我正在寻找一个设备方向模拟器。

Xcode附带一个 iPhone 模拟器，您可以使用它来更改方向。Android SDK还允许您创建可以像真实手机一样使用的虚拟 Android 设备，但可以在计算机屏幕上使用。还有一个Opera 移动模拟器，它对 Opera Mobile 做同样的事情。

然后，您可以免费使用 Prefix来开发您的代码，这样您就不必担心 CSS 的供应商前缀。

Mozilla 建议您在这些设备/模拟器/模拟器上进行测试，也可以直接在设备上进行测试，因为它与您在可信赖的计算机上获得的内容略有不同。

而且，最后但并非最不重要（仅与您的问题稍微相关）有一些非常棒的东西，例如 Weinre、Adobe Shadow和新的 Safari 6 Webinspector，它们可以让您直接在设备上从计算机上调试 JavaScript 并编辑 DOM 和 CSS。Shadow 甚至可以让您一次重新加载几个连接的设备。

于 2012-08-02T21:40:22.083 回答
0

我看到其他人建议使用 Chrome DevTools 模拟器，但现在似乎有错误（参见例如https://code.google.com/p/chromium/issues/detail?id=504343）。

作为对这些问题的回应，我刚刚构建了自己的设备方向模拟器。在任何桌面浏览器中使用这个基于弹出的模拟器的说明可以在以下位置找到：

https://github.com/richtr/deviceorientationemulator

我研究 W3C DeviceOrientation 规范已经有一段时间了，在这一点上我应该说，这个模拟器当前生成的设备方向数据与你今天在 Android 上的任何 Chromium 浏览器中运行 Web 应用程序时获得的完全相同。

希望 Chromium DevTools 模拟器很快会更新，但在此期间我希望这很有用。

于 2015-07-02T15:56:20.187 回答