Question

我正在尝试创建一个响应式网站，几乎已经完成，但我需要一只手，

我正在使用这个例子来了解角度：

angulo = screen.orientation || screen.mozOrientation || screen.msOrientation;



Example angulo.angle
it returns me 0

但它仅适用于使用MSF和chrome的safari。它告诉我 TypeError：undefined不是对象（评估'angulo.angle'）我该怎么办？

Answer 1

如果您需要角度来判断您的网页是处于纵向还是横向模式，请使用以下内容：

document.addEventListener("orientationchange", updateOrientation);

您也可以使用matchMedia

var mql = window.matchMedia("(orientation: portrait)");

// If there are matches, we're in portrait
if(mql.matches) {  
    // Portrait orientation
} else {  
    // Landscape orientation
}

// Add a media query change listener
mql.addListener(function(m) {
    if(m.matches) {
        // Changed to portrait
    }
    else {
        // Changed to landscape
    }
});

或者你可以使用resize事件

window.addEventListener("resize", function() {
    // Get screen size (inner/outerWidth, inner/outerHeight)

}, false);

David Walsh's handy article中有更多提示（但也可能是SO上的其他示例）

Answer 2

Safari / Safari iOS（也称为新IE6）不支持screen.orientation api。您必须改用window.orientation（这不是有效的属性）

示例：http://www.williammalone.com/articles/html5-javascript-ios-orientation/

Safari上的Javascript屏幕方向

2 个答案: