H5网站如何检测移动设备横竖屏并旋转？

现在企业做网站越来越多的企业选择做H5自适应网站，那么中这种自适应网站经常会遇到一个问题就，那就是在移动端展示时，如果横屏的时候，网站不会自动旋转，遇到这种情况怎么办呢？

友软科技的程序员在日前做的一个h5网站中就发现了这种问题，于是想到了一种比较简单的解决方案，通过js来判断移动设备是横屏还是竖屏，如果到网站的访问设备分辨率出现变化，那么我就让它自动刷新一次页面，这样网站页面自然就实现旋转了。

这种方法代码也比较少，也比较容易实现，用到的js代码如下：

function hengshuping(){
window.location.reload();
}
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);

除了这种方法以外，也有一些其他的判断方式来判断浏览设备的分辨率，比如css代码中的“@media”，但是既要让网页判断浏览设备分辨率，同时还要让网页自动旋转，我能想到的最简单的方法也就是以上这段代码了，希望朋友们有什么好的方法也来这里分享一下。

本文链接：http://www.urkeji.com/content/2459.html (转摘请注明出处)

若无特别注明，本站内容均为原创；网站建设业务请咨询本站在线客服！