New API’s are developing (and are currently available)!
screen.orientation.lock(); // webkit only
and
screen.lockOrientation("orientation");
Where “orientation” can be any of the following:
portrait-primary –
It represents the orientation of the screen when it is in its primary portrait mode. A screen is considered in its primary portrait mode if the device is held in its normal position and that position is in portrait, or if the normal position of the device is in landscape and the device held turned by 90° clockwise. The normal position is device dependant.
portrait-secondary –
It represents the orientation of the screen when it is in its secondary portrait mode. A screen is considered in its secondary portrait mode if the device is held 180° from its normal position and that position is in portrait, or if the normal position of the device is in landscape and the device held is turned by 90° anticlockwise. The normal position is device dependant.
landscape-primary –
It represents the orientation of the screen when it is in its primary landscape mode. A screen is considered in its primary landscape mode if the device is held in its normal position and that position is in landscape, or if the normal position of the device is in portrait and the device held is turned by 90° clockwise. The normal position is device dependant.
landscape-secondary –
It represents the orientation of the screen when it is in its secondary landscape mode. A screen is considered in its secondary landscape mode if the device held is 180° from its normal position and that position is in landscape, or if the normal position of the device is in portrait and the device held is turned by 90° anticlockwise. The normal position is device dependant.
portrait –
It represents both portrait-primary and portrait-secondary.
landscape –
It represents both landscape-primary and landscape-secondary.
default –
It represents either portrait-primary and landscape-primary depends on natural orientation of devices. For example, if the panel resolution is 1280800, default will make it landscape, if the resolution is 8001280, default will make it to portrait.
Mozilla recommends adding a lockOrientationUniversal to screen to make it more cross-browser compatible.
screen.lockOrientationUniversal = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;
Go here for more info (deprecated API): https://developer.mozilla.org/en-US/docs/Web/API/Screen/lockOrientation
Modern API docs in MDN is here: https://developer.mozilla.org/en-US/docs/Web/API/ScreenOrientation/lock