screenfull.js是用于跨浏览器使用JavaScript Fullscreen API的简单包装器，可让您将页面或任何元素全屏显示，并且平滑浏览器实现差异，本文只是对封装方法做一个简单的翻译。
github地址：https://github.com/sindresorhus/screenfull.js 。
支持
浏览器支持情况：https://caniuse.com/#feat=fullscreen 。
文档
例子：
全屏显示页面
document.getElementById('button').addEventListener('click', () => {
if (screenfull.enabled) {
screenfull.request();
} else {
// Ignore or do something else
}
});
全屏某个元素
const el = document.getElementById('target');
document.getElementById('button').addEventListener('click', () => {
if (screenfull.enabled) {
screenfull.request(el);
}
});
全屏使用jQuery的元素
const target = $('#target')[0]; // Get DOM element from jQuery collection
$('#button').on('click', () => {
if (screenfull.enabled) {
screenfull.request(target);
}
});
使用jQuery在图像上切换全屏
$('img').on('click', event => {
if (screenfull.enabled) {
screenfull.toggle(event.target);
}
});
检测全屏变化
if (screenfull.enabled) {
screenfull.on('change', () => {
console.log('Am I fullscreen?', screenfull.isFullscreen ? 'Yes' : 'No');
});
}
删除侦听器：
screenfull.off('change', callback);
检测全屏错误
if (screenfull.enabled) {
screenfull.on('error', event => {
console.error('Failed to enable fullscreen', event);
});
}
方法
.request()
使元素全屏。
接受DOM元素。默认是。如果使用除当前活动之外的其他元素进行调用，则如果它是一个后代，它将切换到该元素。
如果您的页面位于内部，