很多时候,当用户在移动端体验产品时,难免会触发手机系统的横屏指令,不可否认,横屏确实可以给用户带来更好的用户体验。
这里提供一些思路,我们给window.orientation取值,正负90表示横屏模式、0和180表现为竖屏模式;
indow.onorientationchange = function(){ switch(window.orientation){ case -90: case 90: alert("横屏:" + window.orientation); case 0: case 180: alert("竖屏:" + window.orientation); break; } }
样式可以这样写:
//竖屏时使用的样式 @media all and (orientation:portrait) { .css{} } //横屏时使用的样式 @media all and (orientation:landscape) { .css{} }
--任何组织或个人分享、转载本博客内容,请务必以链接方式注明出处:来自博客园--下雨天的太阳(http://www.cnblogs.com/doomjx/)--
--请勿以任何形式修改内容(包括文字和图片)--