技术标签： dom JavaScript javascript
属性1：fullscreenElement，该属性返回当前处于全屏模式的DOM元素。
属性2：fullscreenEnabled，该属性返回当前 document 是否进入了可以请求全屏模式的状态。
方法1：requestFullscreen()，请求进入全屏模式。
方法2：exitFullscreen()，退出全屏模式。
事件1：fullscreenchange，进入/退出全屏模式切换时会触发。
事件2：fullscreenerror，进入/退出全屏模式失败时会触发。
由于fullscreen API 存在浏览器兼容性问题，所以我们在使用的时候需要进行跨浏览器处理
function fullscreenElement() {
var fullscreenEle = document.fullscreenElement ||
document.mozFullScreenElement ||
document.webkitFullscreenElement;
//注意：要在用户授权全屏后才能获取全屏的元素，否则 fullscreenEle为null
console.log("全屏元素：" + fullscreenEle);
return fullscreenEle;
}function fullscreenEnable() {
var isFullscreen = document.fullscreenEnabled ||
window.fullScreen ||
document.webkitIsFullScreen ||
document.msFullscreenEnabled;
//注意：要在用户授权全屏后才能准确获取当前的状态
if (isFullscreen) {
console.log('全屏模式');
} else {
console.log('非全屏模式');
}
}function lanchFullscreen(element) {
if (element.requestFullscreen) {
element.requestFullscreen();
}
else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
}
else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
}
else if (element.webkitRequestFullscreen) {
element.webkitRequestFullScreen();
}
}function exitFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
}
else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
}
else if (document.msExitFullscreen) {
document.msExiFullscreen();
}
else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}document.addEventListener('fullscreenchange', function(){
/*code*/ });
document.addEventListener('webkitfullscreenchange', function(){
/*code*/});
document.addEventListener('mozfullscreenchange', function(){
/*code*/});
document.addEventListener('MSFullscreenChange', function(){
/*code*/});document.addEventListener('fullscreenerror', function(){
/*code*/ });
document.addEventListener('webkitfullscreenerror', function(){
/*code*/});
document.addEventListener('mozfullscreenerror', function(){
/*code*/);
document.addEventListener('MSFullscreenError', function(){
/*code*/ });:-webkit-full-screen { }
:-moz-full-screen { }
:-ms-fullscreen { }
:fullscreen { }实例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Full-screen</title>
<script SRC="../lib/jquery.min.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
.container {
width: 100%;
height: 100%;
background: grey;
display: flex;
justify-content: center;
align-items: center;
}
:-webkit-full-screen .container {
background: red;
}
.btn {
width: 300px;
height: 30px;
font-size: 16px;
}
</style>
</head>
<body>
<div class="container">
<button id="btn" class="btn">click</button>
</div>
<script>
var button = document.getElementById('btn');
// 进入全屏
function launchFullScreen(element) {
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
}
}
// 退出全屏
function exitFullScreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.mozExitFullScreen) {
document.mozExitFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
button.onclick = function () {
var isFullScreen = document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement;// 判断是否全屏
if (!isFullScreen) {
launchFullScreen(document.documentElement); // 整个页面全屏
// launchFullScreen(document.getElementById("btn")); // 某个元素全屏
}
else {
exitFullScreen();
}
var fullScreenElement = document.fullscreenEnabled || document.mozFullscreenElement || document.webkitFullscreenElement; // 当前处于全屏状态的元素 element.
var fullScreenEnabled = document.fullscreenEnabled || document.mozFullscreenEnabled || document.webkitFullscreenEnabled; // 标记 fullScreen 当前是否可用.
console.log(fullScreenElement);
console.log(fullScreenEnabled)
};
document.addEventListener('fullscreenchange', function () {
alert(123)
});
document.addEventListener('webkitfullscreenchange', function () {
alert(123)
});
document.addEventListener('mozfullscreenchange', function () {
alert(123)
});
document.addEventListener('MSFullscreenChange', function () {
alert(123)
});
</script>
</body>
</html>文章浏览阅读6k次，点赞2次，收藏33次。Python在PyQt5中使用ECharts绘制图表_pyqt5 pyecharts
文章浏览阅读1.5k次，点赞2次，收藏4次。将静态的网页部署到服务器上，首先需要下载一个xftp，帮助我们上传文件；以及它的服务端xshell帮助我们重启服务器1，首先与服务器建立连接2，要想把我们的静态网页发布到服务器上，前提是我们的服务器安装了nignx,完成这些以后把我们本地的网页文件夹上传到/usr/local/nginx/html的路径下3，文件上传成功后，还需要我们修改nignx的配置文件，打开/usr/local/ng..._网页发布
文章浏览阅读2.1w次，点赞8次，收藏10次。我出现这个错误是因为没有加载我的配置文件在这里插入图片描述可以看到我上图打印的是连接我本地的nacos,并且连接超时但实际我的配置文件并不是配置的本地，看下图这就是典型的没有加载解决办法：完成这些就能加载到配置文件了..._no available server
文章浏览阅读1k次。import numpy as npimport tensorflow_core as tffrom tensorflow.keras.layers import Dense, SimpleRNNimport matplotlib.pyplot as pltimport osinput_word = "abcde"w_to_id = {'a': 0, 'b': 1, 'c': 2, 'd': 3, 'e': 4} # 单词映射到数值id的词典id_to_onehot = {0: [1.,._model.fit报错use_multiprocessing=use_multiprocessing
文章浏览阅读152次。1、创建/guanli 目录，在/guanli下创建zonghe 和 jishu 两个目录（一条命令）[root@localhost ~]mkdir -p /guanli/{zonghe,jishu}2、添加组帐号zonghe、caiwu、jishu，GID号分别设置为2001、2002、2003[root@localhost ~]# groupadd -g 2001 zon..._在chapter04的包cn.itcast.chapter04.prsponse
文章浏览阅读362次。串的定义串是字符串的简称。在数据结构中，串是一种在数据元素的组成上具有一定约束条件的线性表，即要求组成线性表的所有数据元素都是字符，所以说串是一个有穷的字符序列。串是由零个或多个字符组成的有限序列，记作s=”s0s1…sn-1”(n≥0)，其中s是串名，字符个数n称作串的长度，双撇号括起来的字符序列”s0s1…sn-1”是串的值字符串(String)是由数字、字母、任何其它的符号组成的一串字符。零个字符的串（即：""）称为空串，空串不包含任何字符。值得注意的是：（1）长度为1的空格串" “不等同于_空串是什么都没有字符串吗
文章浏览阅读701次，点赞3次，收藏5次。1、字符的ASCII码：获取字符ASCII码：(int)a或int m=a;获取ASCII对应的字符：(char)m或char a=m;字符之间相加减，就是ASCII的加减：int n=a-b;得到的n就是ASCII码，对应的字符为(char)n;2、字符串和数字间的转换：#include<sstream>#include<string>using namespace std;int main(){ double a = 123.32; _c++string字符变ascii
文章浏览阅读6.5k次，点赞4次，收藏3次。当我们改变前端页面传输给后台sql参数时，页面没有显示相应内容也没有显示报错信息时，不能使用联合查询注入和报错注入，这时我们可以考虑是否为基于布尔的盲注。利用页面返回的布尔类型状态，正常或者不正常；我们输入的语句让页面呈现出两种状态，相当于true和false，根据这两种状态可以判断我们输入的语句是否查询成功。布尔盲注就是根据这两种状态，来反推我们输入的条件是真还是假。以sqli-labs-masterless-8关为例_oracle布尔盲注
文章浏览阅读1w次，点赞10次，收藏72次。创建地图是一件比较复杂的工作，ROS利用map_server地图服务器，借助激光雷达和机器人的里程信息来完成这项工作。本篇我们还是利用柳树车库作为默认的地图环境。主要介绍了地图的创建、保存、加载，下一篇尝试配置导航功能包集，并在gazebo仿真环境下完成自定义机器人的自主导航。httpshttpshttpshttps。..._ros建图
文章浏览阅读3.2k次。在Magento中，CMS页、产品页、分类页均可以设置Meta keywords与Meta Description。但在其它页面上如何设置呢？例如今天SEO团队发来文档，要求修改Checkout页、MyAccount页、Login页、Contact页等等的页标题与Meta描述部分。于是第一反应就是用XML来配置.另：在System-Configration-Design-Html-_magento seo suite 自定义 meta description
文章浏览阅读1.3k次。第4章-15 换硬币分析题目解法分析为了实现各个硬币数目>=1，range()函数设定倒序范围，先求五分硬币数目，再求二分硬币数目，最后求一分硬币数目，注意在往下递推求解的过程中，各个硬币数目的条件是>=1，这影响到range(five,0,-1)和if one>=1:题目将一笔零钱换成5分、2分和1分的硬币，要求每种硬币至少有一枚，有几种不同的换法？输入格式:输入在一行中给出待换的零钱数额x∈(8,100)。输出格式:要求按5分、2分和1分硬币的数量依次从大到小的顺序_pta换硬币python
文章浏览阅读1w次，点赞6次，收藏23次。一、查看防火墙状态1、首先查看防火墙是否开启，如未开启，需要先开启防火墙并作开机自启systemctl status firewalld开启防火墙并设置开机自启systemctl start firewalldsystemctl enable firewalld一般需要重启一下机器，不然后面做的设置可能不会生效二、开放或限制端口1、开放端口（1）如我们需要开启XShell连接时需要使用的22端口firewall-cmd --zone=public --add-port=22/tcp _firewall-cmd --zone=public --list-ports