js移动端强制横屏

/* 竖屏样式 */
@media screen and (orientation: portrait) {
  body {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    height: 100vw;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
  }
}

/* 横屏样式 */
@media screen and (orientation: landscape) {
  body {
    /* 默认样式 */
  }
}

function checkOrientation() {
  if (window.innerHeight > window.innerWidth) {
    // 竖屏
    alert('请将设备旋转至横屏模式');
    // 可以在这里添加更多逻辑，比如禁用某些功能
  }
}

window.addEventListener('resize', checkOrientation);
window.addEventListener('load', checkOrientation);

function requestLandscape() {
  if (screen.orientation && screen.orientation.lock) {
    screen.orientation.lock('landscape').then(() => {
      console.log('屏幕已锁定为横屏');
    }).catch(err => {
      console.error('无法锁定屏幕方向', err);
    });
  } else {
    alert('请将设备旋转至横屏模式');
  }
}

window.addEventListener('load', requestLandscape);

if (screen.orientation && screen.orientation.lock) {
  // 支持屏幕方向锁定
} else {
  // 不支持屏幕方向锁定，使用其他方法
}