Home >Web Front-end >CSS Tutorial >How Can We Achieve a Soft Fullscreen Experience on iOS 8 Without the `minimal-ui` Viewport Property?
iOS 8 Removes "minimal-ui" Viewport Property: Soft Fullscreen Workarounds
With the release of iOS 8 beta 4, the question arises: Can we still create a "soft fullscreen" user experience on iOS devices without the minimal-ui viewport property?
Concern: Address Bar Visibility
One of the challenges with fullscreen experiences involves hiding the address bar and navigation menu. Traditionally, a wrapper div filling the viewport and setting overflow to hidden or auto could address this. However, this method prohibits the browser from hiding those elements.
Revised Strategy
While the minimal-ui property is no longer supported, the concept remains. Users can still access it with a "touch-drag down" gesture. To manage this view state effectively and calculate the dimensions of the minimal-ui, third-party solutions like Brim - view manager for iOS 8 have emerged.
Brim's Implementation
Brim's implementation involves:
Benefits of Brim
The result is a smooth transition into and out of the minimal-ui view, providing users with a fullscreen experience without compromising browser functionality and accessibility.
Additional Considerations
It's important to note that detecting device orientation using Scream is reliable only after the rotation animation has ended.
Conclusion
While the removal of the minimal-ui viewport property may seem like a setback, solutions like Brim offer alternative methods to achieve a "soft fullscreen" experience on iOS 8 devices, balancing the need for screen real estate with accessibility and user satisfaction.
The above is the detailed content of How Can We Achieve a Soft Fullscreen Experience on iOS 8 Without the `minimal-ui` Viewport Property?. For more information, please follow other related articles on the PHP Chinese website!