移动端 -- 屏幕旋转的事件和样式

1、事件 window.orientation

window.orientation

取值：

正负90 表示横屏模式；

0和180 表现为竖屏模式；

window.onorientationchange = function(){ 
    switch(window.orientation){ 
       case -90: 
       case 90: 
        alert("横屏:" + window.orientation); 
       case 0: 
       case 180: 
        alert("竖屏:" + window.orientation); 
        break; 
    } 
}   

2、竖屏和横屏的样式区分：

/*竖屏时使用的样式*/ 
@media all and (orientation:portrait) { 
    .css{} 
}  



/*横屏时使用的样式*/ 
@media all and (orientation:landscape) { 
    .css{} 
}