Limited availability
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The Device Posture API allows developers to create user interfaces that adapt to a foldable device's posture and respond to posture changes.
Concepts and usageFoldable devices present unique design challenges to developers â they can be used like a regular flat screen or like a book. In addition, some of them feature a single folded screen, and some of them feature two screens with a hinged join in the middle. Care must be taken to ensure that content is not hidden by the physical join, or rendered difficult to read due to close proximity to the central fold.
The Device Posture API defines postures, which indicate the current physical folding state of a device. The current available postures are:
continuous
Indicates a flat screen state. Foldable devices are continuous
while they are flat; either fully opened or fully closed. Non-foldable devices are considered flat and therefore always continuous
â this includes seamless curved displays and standard desktop, laptop, tablet, and mobile screens.
folded
Indicates a folded screen state. Foldable devices are folded
while used in a book or laptop posture.
The Device Posture API includes features enabling you to run scripts and vary layouts depending on current device posture and posture changes.
CSS featuresdevice-posture
@media
feature
Detects the device's current posture.
DevicePosture
Represents the device's posture, providing access to the current posture type
and a change
event that fires on posture change.
Navigator.devicePosture
The entry point for the Device Posture API â returns the browser's DevicePosture
object.
You can find a complete example showing all of the features in action in the Device Posture API demo.
If possible, you should view this on a foldable device. Current browser developer tools enable emulating foldable devices, but don't include emulation of partially folded devices â only fully open or closed â so they will always return continuous
.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4