Detect Orientation Change on Mobile Devices
Mar 24, 2015 · 1 分钟阅读

  • Media Queries:
@media screen and (orientation: landscape) {
  /* landscape */
}
@media screen and (orientation: portrait) {
  /* portrait */
}
  • resize Event:
window.addEventListener('resize', function() {
  if (window.innerWidth > window.innerHeight) {
    // landscape
  } else {
    // portrait
  }
}, false);
  • orientationchange Event:
window.addEventListener('orientationchange', function() {
  switch (window.orientation) {
    case -90:
    case 90:
      // landscape
      break;
    default:
      // portrait
      break;
  }
}, false);
← Previous Post Next Post →

Ryun的博客
与其感慨路难行,不如马上出发。

atom css design git html javascript jekyll laravel life mac mobile optimization sublime tool vscode vue
mac

About

你好,❤朋友

这里是 Ryun 的博客 📝

📝记录了我学习 🔎的过程

作为一名前端攻城狮 🦁

希望能和大家一起 🔎

共同进步 🏃

🦁的特长:

  • HTML5
  • CSS3
  • JavaScript
  • Vue.js
  • 微信小程序
  • 熟练配合 Node.js、PHP 和 Laravel
  • 熟练使用各种开发和设计工具

🦁喜欢 🆒🆒的东西

对提升效率和美感的事物有兴趣 😋

欢迎 👏交流


see this hugo-theme-dream-ink