screenfull.js 介绍
screenfull.js是用于跨浏览器使用JavaScript Fullscreen API的简单包装器,可让您将页面或任何元素全屏显示,并且平滑浏览器实现差异 。
安装:
在命令行中执行: (注:因为这是生产依赖,所以执行--save)
npm install --save screenfull
例子:
全屏显示页面
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);
});
}
网站地址:https://sindresorhus.com/screenfull.js
GitHub:https://github.com/sindresorhus/screenfull.js
网站描述:浏览器全屏插件
screenfull.js
官方网站:https://sindresorhus.com/screenfull.js
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。