移动端识别横屏/竖屏
1.js识别
window.addEventListener("resize", ()=>{ if (window.orientation === 180 || window.orientation === 0) { // 正常方向或屏幕旋转180度 console.log('竖屏'); }; if (window.orientation === 90 || window.orientation === -90 ){ // 屏幕顺时钟旋转90度或屏幕逆时针旋转90度 console.log('横屏'); } });
2.css识别
@media screen and (orientation: portrait) { /*竖屏...*/ } @media screen and (orientation: landscape) { /*横屏...*/ }
Js/Css两种识别方式