Блокировка Chrome (мобильный-Android) для Портрета

Question

Я попробовал это в моих таблицах стилей.

   @viewport {
    orientation: portrait; 
  }

Экран все еще вращается.

Я видел много решений с участием JQuery. Я ищу решение без Jquery из-за ограничения веса файла. И меня беспокоит только Chrome на Android, а не iOS.

Любое решение?

---

Обновление: я тоже пробовал

    var lockOrientation = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;

    lockOrientation("portrait-primary");

Не работает

Answer 1

Мне удалось решить проблему с помощью CSS - хотя это не идеально - мне еще предстоит протестировать это на многих устройствах. Надеюсь, что это будет полезно для людей, которые хотят заблокировать ориентацию в Интернете.

@media (max-height: 480px) and (min-width: 480px) and (max-width: 600px) { 
html{
    -webkit-transform: rotate(-90deg);
       -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
         -o-transform: rotate(-90deg);
            transform: rotate(-90deg);
    -webkit-transform-origin: left top;
       -moz-transform-origin: left top;
        -ms-transform-origin: left top;
         -o-transform-origin: left top;
            transform-origin: left top;
    width: 320px; /*this is the iPhone screen width.*/
    position: absolute;
    top: 110%;
        left: 0
}
}