通过css / js / html强制设备定位到风景？

Question

  

可能重复：
  Mobile site - force landscape only / no auto-rotate

我已经看到了一些关于此问题的posts但未真正找到明确的答案，而是一些建议的解决方法。

是否可以通过网页强制设备方向？即：我可以将我的网站视为景观吗？

非常感谢

Answer 1

你可以使用JavaScript。首先检查是否支持：

if (window.DeviceOrientationEvent) {
    console.log("DeviceOrientation is supported");
}

如果要在轮换时执行某些操作，请添加eventListener：

window.addEventListener('deviceorientation', function(eventData) {});

我猜你应该在转身时触发你的一方回应。您无法触发方向，因为设备会执行此操作。因此，当您的网站以横向模式加载时，您应该检测它并以横向模式呈现网站（加载自定义css？）然后当访问者转动手机或平板电脑时，收听者可以使用新的CSS重新呈现您的网站通过JavaScript文件（jQuery建议用于这些情况）。

你也可以做到这一点，网站没有太多的动态，你可以用GET方法调用重新加载页面来改变方向，但是当然这可能是一个较慢的选择。使用JavaScript在移动设备上重新渲染整个网站，甚至可以为我之前在iPhone上测试的内容加热手机。 JavaScript引擎速度很快，可以提取大量CPU来平滑地渲染所有内容，但是在短时间内也会占用很多资源，这使得移动设备很难持续保持渲染效果。最好的例子是使用JavaScript调用制作HTML5游戏。 iPhone最终会像在App：P中玩游戏一样升温。