Game Development Reference
In-Depth Information
#snap-view{
display: none;
}
}
@media screen and (-ms-view-state: filled) {
#canvas{
display: block;
}
#snap-view{
display: none;
}
}
@media screen and (-ms-view-state: snapped) {
#canvas{
display: none;
}
#snap-view{
display: block;
}
}
As you can see, I have set up a CSS meta selector for detecting the snap view. You can also
use a min-width meta selector if you want to use this code on the Web and in Windows 8 to
help maintain constancy between your code base.
Now, let's take a look at how to maintain this via JavaScript. Here is what the code for that
looks like in my game.
if (newViewState === viewStates.snapped) {
canvas.style.display = "none";
snapView.style.display = "block";
} else if (newViewState === viewStates.filled) {
canvas.style.display = "block";
snapView.style.display = "none";
} else if (newViewState === viewStates.fullScreenLandscape) {
canvas.style.display = "block";
snapView.style.display = "none";
}
Search WWH ::




Custom Search