有一个带有这些规则的 CSS 文件:
@media screen and (orientation:portrait) {
.foo {}
}
@media screen and (orientation:landscape) {
.foo {}
}
然后我得到了这个脚本,运行在orientationchange
:
function checkOr(){
if (window.matchMedia("(orientation:portrait)").matches) {
console.log('portrait ' + window.orientation);
} else {
console.log('landscape '+ window.orientation);
}
}
但是当 window.orientation 返回正确的值时,matchMedia 总是返回页面的初始状态:
portrait -90
portrait 0
portrait -90
在最新 iOS 更新的 iPhone 5 和 iPad 4 上测试。
我究竟做错了什么? Webkit bugtracker说每个媒体查询都必须有规则,但这不是我的情况。