The Device Posture API allows web applications to request and be notified of changes of the posture of a device.
The polyfill allows you to emulate this behavior on devices that do not have folding capabilities. It helps you visualize how the content responds to the different angle and posture configurations.
There are two ways of using the polyfill:
As an example, the web component has been added to this page. You can change the values with the provided GUI and see how the circle reacts accordingly.
@media Query | |
---|---|
(device-posture: folded-over) { applies to tent modes } | |
(device-posture: folded) { applies to laptop/book postures} | |
(device-posture: continous) { applies to flat, tablet, or even seamless curved displays } |