Correct Answer:
Explanation/Reference:
Note:
Step 1: We need to set up the event handler for any Viewstate changes.
This got a lot simpler for the Windows 8 Release Preview. We need only add an event listener to the window resize event like so:
window.addEventListener("resize", onViewStateChanged);
Step 2-3:
When onViewStateChanged runs it enumerates through all available viewstates and passes the current view state to a custom function.
Example code:
When onViewStateChanged runs it enumerates through all available viewstates and passes the current view state to a custom function I call showMenu.
Step 4: Finally handle the layout changes
* ApplicationViewState enumeration specifies the set of app view state changes that can be handled.
The ApplicationViewState enumeration has these members.
A)FullScreenLandscape | fullScreenLandscape0
The current app’s view is in full-screen (has no snapped app adjacent to it), and has changed to landscape orientation.
B) Filled | filled1
The current app’s view has been reduced to a partial screen view as the result of another app snapping.
C) Snapped | snapped2
The current app’s view has been snapped.
D) FullScreenPortrait | fullScreenPortrait3
The current app’s view is in full-screen (has no snapped app adjacent to it), and has changed to portrait orientation.
Reference: Handling Fullscreen, Snapped and Filled states in Windows 8 Metro Style apps using CSS3 and JavaScript - DaveDev - Site Home - MSDN Blogs