CSS3 判断横竖屏
@media screen and (orientation: portrait) {
body{background:red;}}
@media screen and (orientation: landscape) {
body{background:blue;}
}
#box{
color: #fff;font-size: 30px;
text-align: center;
}
HTML5判断横竖屏
window.addEventListener("deviceorientation", function() {
if (window.orientation === 180 || window.orientation === 0) {
alert("竖屏状态!");
}
if (window.orientation === 90 || window.orientation === -90 ){
alert("横屏状态!");
}
}, false);