是否可以使用JavaScript在iPad或Galaxy Tab上检测浏览器方向的变化?我认为使用CSS媒体查询是可能的。
更新:
您可能要签出
jQuery移动方向更改
或普通的JS之一:
window.addEventListener("orientationchange", function() { alert(window.orientation); }, false);
MDN:
window.addEventListener("orientationchange", function() { alert("the orientation of the device is now " + screen.orientation.angle); });
较旧的答案
http://www.nczonline.net/blog/2010/04/06/ipad-web-development- tips/
iPad上的Safari确实支持window.orientation属性,因此,如有必要,您可以使用它来确定用户是水平还是垂直模式。作为此功能的提醒:
window.orientation is 0 when being held vertically window.orientation is 90 when rotated 90 degrees to the left (horizontal) window.orientation is -90 when rotated 90 degrees to the right (horizontal)
旋转设备时,还会在窗口对象上触发directionchange事件。
您还可以使用CSS媒体查询来确定iPad是垂直放置还是水平放置,例如:
<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css"> <link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css">
http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3889591/Detect- and-Set-the-iPhone–iPads-Viewport-Orientation-Using-JavaScript-CSS-and-Meta- Tags .htm
<script type="text/javascript"> var updateLayout = function() { if (window.innerWidth != currentWidth) { currentWidth = window.innerWidth; var orient = (currentWidth == 320) ? "profile" : "landscape"; document.body.setAttribute("orient", orient); window.scrollTo(0, 1); } }; iPhone.DomLoad(updateLayout); setInterval(updateLayout, 400); </script>