HTML and CSS Reference
In-Depth Information
outline
: none;
}
Exiting full-screen mode
Now that the full screen has a pleasant dark-blue background in all browsers, the next issue
to consider is what happens when the user exits full-screen mode by hitting Esc. In a more
complex app, you may want to pause an activity or take the opportunity to switch to a dif-
ferent mode of interaction. To do this, listen to the
fullscreenchange
event. Our next
listing has some example code.
Listing I.25. Add a listener to the
fullscreenchange
event
document
.
addEventListener
(
"fullscreenchange"
,
function
() {
console
.
log
(
document
.
fullscreen
);
},
false
);
document
.
addEventListener
(
"mozfullscreenchange"
,
function
() {
console
.
log
(
document
.
mozFullScreen
);
},
false
);
document
.
addEventListener
(
"webkitfullscreenchange"
,
function
() {
console
.
log
(
document
.
webkitIsFullScreen
);
},
false
);
Feel free to experiment with these events further; we're not going to go into any more de-
tail. In the next section, you're going to jump to mobile; to get full advantage you should
have an iPhone or Android device handy.
I.3.4. The Device Orientation API: controlling on-screen movement by tilting a device
The Device Orientation API delivers events to your web page that correspond to the move-
ment of the device. The device can be rotated around three axes; have a look at
figure I.14
.
