Since there is not a way for iOS 7 users to toggle full screen mode in mobile Safari, developers have been scrambling to find a way to detect when the nav and status bars show and hide. While it’s not ideal, I have a working solution.
When the interface is showing, the innerHeight and outerHeight of the window do not match. When the interface is hidden, they do match. So, for iOS7 phone and iPod users, I set up a function that checks if these match once a second (I’m doing this for a game, so I want it to be fairly responsive):
if((window.orientation == 90 || window.orientation == -90) && window.innerHeight != window.outerHeight)
// Handle interface here
I’m only adapting if the interface shows when the phone is in landscape mode. You can remove the window.orientation check if that doesn’t matter to you.