web建站教程

  1. 首页
  2. vuejs
  3. js
  4. 好玩
  5. seo教程
  6. 前端知识
  7. 百度echarts
  8. php入门
    nodejs
    mockjs
    mysql
    织梦cms
    帝国cms
    git教程

F11全屏功能和js全屏功能冲突解决方法

200 ℃

下面web建站教程为大家介绍一下F11全屏功能和js全屏功能冲突解决方法

功能介绍:右键菜单做了一个显示全屏和取消全屏功能,但是用了F11全屏后,js全屏取消不了,两种冲突了!下面介绍一下解决方法!

var isFull = Math.abs(window.screen.height-window.document.documentElement.clientHeight) <= 17
window.onresize = function () {
    isFull = Math.abs(window.screen.height-window.document.documentElement.clientHeight) <= 17
}
// 阻止F11键默认事件,用HTML5全屏API代替
window.addEventListener('keydown', function (e) {
    e = e || window.event
    if (e.keyCode===122 && !isFull) {
        e.preventDefault()
        enterFullScreen()
    }
})
// 打开浏览器全屏模式
function enterFullScreen () {
  let el = document.documentElement
  let rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen
  if (rfs) { // typeof rfs != "undefined" && rfs
	rfs.call(el)
  } else if (typeof window.ActiveXObject !== 'undefined') {
	// for IE,这里其实就是模拟了按下键盘的F11,使浏览器全屏
	let wscript = new ActiveXObject('WScript.Shell')
	if (wscript != null) {
	  wscript.SendKeys('{F11}')
	}
  }
}
// 退出全屏
function exitFullScreen () {
  let el = document
  let cfs = el.cancelFullScreen || el.mozCancelFullScreen || el.msExitFullscreen || el.webkitExitFullscreen || el.exitFullscreen
  if (cfs) { // typeof cfs != "undefined" && cfs
	cfs.call(el)
  } else if (typeof window.ActiveXObject !== 'undefined') {
	// for IE,这里和fullScreen相同,模拟按下F11键退出全屏
	let wscript = new ActiveXObject('WScript.Shell')
	if (wscript != null) {
	  wscript.SendKeys('{F11}')
	}
  }
}

js按钮控制全屏和退出全屏

js解决前端代码中因引号和空额冲突的解决方法

上面是“F11全屏功能和js全屏功能冲突解决方法”的全面内容,想了解更多关于 js 内容,请继续关注web建站教程。

当前网址:https://ipkd.cn/webs_2255.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

Visual studio code配置选项大全

// Visual studio code通过将设置放入设置文件中来覆盖设置。
{
    //-------- 编辑器配置 --------

    // 控制字体系列。
    "editor.fontFamily": "Consolas, 'Courier New', monospace",

    // 控制字体大小。
    "editor.fontSize": 14,

    // 控制行高。
    "editor.lineHeight": 0,

    // 控制行号的可见性
    "editor.lineNumbers": true,

    // 控制字形边距的可见性
    "editor.glyphMargin": false,

    // 显示垂直标尺的列
    "editor.rulers": [],

    // 执行文字相关的导航或操作时将用作文字分隔符的字符
    "editor.wordSeparators": "`~!@#$%^&*()-=+[{]}\\|;:'\",.<>/?",

    // 一个制表符等于的空格数。
    "editor.tabSize": 4,

    // 按 "Tab" 时插入空格。
    "editor.insertSpaces": true,

    // 当打开文件时,将基于文件内容检测 "editor.tabSize" 和 "editor.insertSpaces"。
    "editor.detectIndentation": true,

    // 控制选取范围是否有圆角
    "editor.roundedSelection": true,

    // 控制编辑器是否可以滚动到最后一行之后
    "editor.scrollBeyondLastLine": true,

    // 控制在多少个字符后编辑器会自动换到下一行。将其设置为 0 则将打开视区宽度换行(自动换行)。将其设置为 -1 则将强制编辑器始终不换行。
    "editor.wrappingColumn": 300,

    // 控制换行的行的缩进。可以是"none"、 "same" 或 "indent"。
    "editor.wrappingIndent": "same",

    // 要对鼠标滚轮滚动事件的 "deltaX" 和 "deltaY" 使用的乘数 
    "editor.mouseWheelScrollSensitivity": 1,

    // 控制键入时是否应显示快速建议
    "editor.quickSuggestions": true,

    // 控制延迟多少毫秒后将显示快速建议
    "editor.quickSuggestionsDelay": 10,

    // 控制编辑器是否应该在左括号后自动插入右括号
    "editor.autoClosingBrackets": true,

    // 控制编辑器是否应在键入后自动设置行的格式
    "editor.formatOnType": false,

    // 控制键入触发器字符时是否应自动显示建议
    "editor.suggestOnTriggerCharacters": true,

    // 控制除了 "Tab" 以外,是否还应在 "Enter" 时接受建议。帮助避免“插入新行”或“接受建议”之间的歧义。
    "editor.acceptSuggestionOnEnter": true,

    // 控制编辑器是否应突出显示选项的近似匹配
    "editor.selectionHighlight": true,

    // 控制可在概述标尺同一位置显示的效果数量
    "editor.overviewRulerLanes": 3,

    // 控制光标闪烁动画,接受的值为'blink'、'visible' 和 'hidden'
    "editor.cursorBlinking": "blink",

    // 控制光标样式,接受的值为 'block' 和 'line'
    "editor.cursorStyle": "line",

    // 启用字体连字
    "editor.fontLigatures": false,

    // 控制光标是否应隐藏在概述标尺中。
    "editor.hideCursorInOverviewRuler": false,

    // 控制编辑器是否应呈现空白字符
    "editor.renderWhitespace": false,

    // 控制编辑器是否显示支持它的模式的参考信息
    "editor.referenceInfos": true,

    // 控制编辑器是否启用代码折叠功能
    "editor.folding": true,

    // 在制表位后插入和删除空格
    "editor.useTabStops": true,

    // 删除尾随自动插入的空格
    "editor.trimAutoWhitespace": true,

    // Keep peek editors open even when double clicking their content or when hitting Escape.
    "editor.stablePeek": false,

    // 控制 Diff 编辑器以并排或内联形式显示差异
    "diffEditor.renderSideBySide": true,

    // 控制差异编辑器是否将对前导空格或尾随空格的更改显示为差异
    "diffEditor.ignoreTrimWhitespace": true,

    //-------- 窗口配置 --------

    // 启用后,将在新窗口中打开文件,而不是重复使用现有实例。
    "window.openFilesInNewWindow": true,

    // 控制重启后重新打开文件夹的方式。选择“none”表示永不重新打开文件夹,选择“one”表示重新打开最后使用的一个文件夹,或选择“all”表示打开上次会话的所有文件夹。
    "window.reopenFolders": "one",

    // 调整窗口的缩放级别。原始大小是 0,每次递增(例如 1)或递减(例如 -1)表示放大或缩小 20%。也可以输入小数以便以更精细的粒度调整缩放级别。
    "window.zoomLevel": 0,

    //-------- 文件配置 --------

    // 配置 glob 模式以排除文件和文件夹。
    "files.exclude": {
        "**/.git": true,
        "**/.svn": true,
        "**/.DS_Store": true
    },

    // 配置语言的文件关联(如: "*.extension": "html")。这些关联的优先级高于已安装语言的默认关联。
    "files.associations": {},

    // 读取和编写文件时将使用的默认字符集编码。
    "files.encoding": "utf8",

    // 默认行尾字符。
    "files.eol": "\r\n",

    // 启用后,将在保存文件时剪裁尾随空格。
    "files.trimTrailingWhitespace": false,

    // 控制已更新文件的自动保存。接受的值:“off”、“afterDelay”、“onFocusChange”。如果设置为“afterDelay”,则可在 "files.autoSaveDelay" 中配置延迟。
    "files.autoSave": "off",

    // 控制延迟(以秒为单位),在该延迟后将自动保存更新后的文件。仅在 "files.autoSave" 设置为“afterDelay”时适用。
    "files.autoSaveDelay": 1000,

    // 配置文件路径的 glob 模式以从文件监视排除。更改此设置要求重启。如果在启动时遇到 Code 消耗大量 CPU 时间,则可以排除大型文件夹以减少初始加载。
    "files.watcherExclude": {
        "**/.git/objects/**": true
    },

    //-------- Emmet 配置 --------

    // 启用后,按 TAB 键时,将展开 Emmet 缩写。
    "emmet.triggerExpansionOnTab": true,

    //-------- 文件资源管理器配置 --------

    // 在滚动条出现之前将显示的最大工作文件数目。
    "explorer.workingFiles.maxVisible": 9,

    // 控制工作文件部分的高度是否应动态适应元素数量。
    "explorer.workingFiles.dynamicHeight": true,

    // 控制资源管理器是否应在打开文件时自动显示它们。
    "explorer.autoReveal": true,

    //-------- HTTP 配置 --------

    // 要使用的代理设置。如果尚未设置,则将从 http_proxy 和 https_proxy 环境变量获取
    "http.proxy": "",

    // 是否应根据提供的 CA 列表验证代理服务器证书。
    "http.proxyStrictSSL": true,

    //-------- 搜索配置 --------

    // 配置 glob 模式以在搜索中排除文件和文件夹。从 files.exclude 设置中继承所有 glob 模式。
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true
    },

    //-------- 更新配置 --------

    // 配置从中接收更新的更新频道。更改后需要重启。
    "update.channel": "default",

    //-------- GIT 配置 --------

    // 是否启用了 GIT
    "git.enabled": true,

    // 可执行 GIT 的路径
    "git.path": null,

    // 是否启用了自动提取。
    "git.autofetch": true,

    //-------- 标记预览配置 --------

    // 标记预览中供使用的 CSS 样式表的 URL 或本地路径列表。
    "markdown.styles": [],

    //-------- JSON configuration --------

    // Associate schemas to JSON files in the current project
    "json.schemas": [],

    //-------- 遥测配置 --------

    // 启用要发送给 Microsoft 的使用情况数据和错误。
    "telemetry.enableTelemetry": true,

    //-------- 遥测配置 --------

    // 启用要发送给 Microsoft 的故障报表。
    // 此选项需重启才可生效。
    "telemetry.enableCrashReporter": true,

    //-------- CSS 配置 --------

    // 控制 CSS 验证和问题严重性。

    // 启用或禁用所有验证
    "css.validate": true,

    // 使用供应商特定前缀时,确保同时包括所有其他供应商特定属性
    "css.lint.compatibleVendorPrefixes": "ignore",

    // 使用供应商特定前缀时,还应包括标准属性
    "css.lint.vendorPrefix": "warning",

    // 不要使用重复的样式定义
    "css.lint.duplicateProperties": "ignore",

    // 不要使用空规则集
    "css.lint.emptyRules": "warning",

    // Import 语句不会并行加载
    "css.lint.importStatement": "ignore",

    // 使用边距或边框时,不要使用宽度或高度
    "css.lint.boxModel": "ignore",

    // 已知通配选择符 (*) 慢
    "css.lint.universalSelector": "ignore",

    // 零不需要单位
    "css.lint.zeroUnits": "ignore",

    // @font-face 规则必须定义 "src" 和 "font-family" 属性
    "css.lint.fontFaceProperties": "warning",

    // 十六进制颜色必须由三个或六个十六进制数字组成
    "css.lint.hexColorLength": "error",

    // 参数数量无效
    "css.lint.argumentsInColorFunction": "error",

    // 未知的属性。
    "css.lint.unknownProperties": "warning",

    // 仅当支持 IE7 及更低版本时,才需要 IE hack
    "css.lint.ieHack": "ignore",

    // 未知的供应商特定属性。
    "css.lint.unknownVendorSpecificProperties": "ignore",

    // 因显示而忽略属性。例如,使用 "display: inline"时,宽度、高度、上边距、下边距和 float 属性将不起作用
    "css.lint.propertyIgnoredDueToDisplay": "warning",

    // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
    "css.lint.important": "ignore",

    // 避免使用“float”。浮动会带来脆弱的 CSS,如果布局的某一方面更改,将很容易破坏 CSS。
    "css.lint.float": "ignore",

    // 选择器不应包含 ID,因为这些规则与 HTML 的耦合过于紧密。
    "css.lint.idSelector": "ignore",

    //-------- HTML 配置 --------

    // 每行最大字符数(0 = 禁用)。
    "html.format.wrapLineLength": 120,

    // 标记列表,以逗号分隔,不应重设格式。"null" 默认为所有内联标记。
    "html.format.unformatted": "a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, script, select, small, span, strong, sub, sup, textarea, tt, var",

    // 缩进 <head> 和 <body> 部分。
    "html.format.indentInnerHtml": false,

    // 是否要保留元素前面的现有换行符。仅适用于元素前,不适用于标记内或文本。
    "html.format.preserveNewLines": true,

    // 要保留在一个区块中的换行符的最大数量。对于无限制使用 "null"。
    "html.format.maxPreserveNewLines": null,

    // 格式和缩进 {{#foo}} 和 {{/foo}}。
    "html.format.indentHandlebars": false,

    // 以新行结束。
    "html.format.endWithNewline": false,

    // 标记列表,以逗号分隔,其前应有额外新行。"null" 默认为“标头、正文、/html”。
    "html.format.extraLiners": "head, body, /html",

    //-------- LESS 配置 --------

    // 控制 LESS 验证和问题严重性。

    // 启用或禁用所有验证
    "less.validate": true,

    // 使用供应商特定前缀时,确保同时包括所有其他供应商特定属性
    "less.lint.compatibleVendorPrefixes": "ignore",

    // 使用供应商特定前缀时,还应包括标准属性
    "less.lint.vendorPrefix": "warning",

    // 不要使用重复的样式定义
    "less.lint.duplicateProperties": "ignore",

    // 不要使用空规则集
    "less.lint.emptyRules": "warning",

    // Import 语句不会并行加载
    "less.lint.importStatement": "ignore",

    // 使用边距或边框时,不要使用宽度或高度
    "less.lint.boxModel": "ignore",

    // 已知通配选择符 (*) 慢
    "less.lint.universalSelector": "ignore",

    // 零不需要单位
    "less.lint.zeroUnits": "ignore",

    // @font-face 规则必须定义 "src" 和 "font-family" 属性
    "less.lint.fontFaceProperties": "warning",

    // 十六进制颜色必须由三个或六个十六进制数字组成
    "less.lint.hexColorLength": "error",

    // 参数数量无效
    "less.lint.argumentsInColorFunction": "error",

    // 未知的属性。
    "less.lint.unknownProperties": "warning",

    // 仅当支持 IE7 及更低版本时,才需要 IE hack
    "less.lint.ieHack": "ignore",

    // 未知的供应商特定属性。
    "less.lint.unknownVendorSpecificProperties": "ignore",

    // 因显示而忽略属性。例如,使用 "display: inline"时,宽度、高度、上边距、下边距和 float 属性将不起作用
    "less.lint.propertyIgnoredDueToDisplay": "warning",

    // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
    "less.lint.important": "ignore",

    // 避免使用“float”。浮动会带来脆弱的 CSS,如果布局的某一方面更改,将很容易破坏 CSS。
    "less.lint.float": "ignore",

    // 选择器不应包含 ID,因为这些规则与 HTML 的耦合过于紧密。
    "less.lint.idSelector": "ignore",

    //-------- Sass 配置 --------

    // 控制 Sass 验证和问题严重性。

    // 启用或禁用所有验证
    "sass.validate": true,

    // 使用供应商特定前缀时,确保同时包括所有其他供应商特定属性
    "sass.lint.compatibleVendorPrefixes": "ignore",

    // 使用供应商特定前缀时,还应包括标准属性
    "sass.lint.vendorPrefix": "warning",

    // 不要使用重复的样式定义
    "sass.lint.duplicateProperties": "ignore",

    // 不要使用空规则集
    "sass.lint.emptyRules": "warning",

    // Import 语句不会并行加载
    "sass.lint.importStatement": "ignore",

    // 使用边距或边框时,不要使用宽度或高度
    "sass.lint.boxModel": "ignore",

    // 已知通配选择符 (*) 慢
    "sass.lint.universalSelector": "ignore",

    // 零不需要单位
    "sass.lint.zeroUnits": "ignore",

    // @font-face 规则必须定义 "src" 和 "font-family" 属性
    "sass.lint.fontFaceProperties": "warning",

    // 十六进制颜色必须由三个或六个十六进制数字组成
    "sass.lint.hexColorLength": "error",

    // 参数数量无效
    "sass.lint.argumentsInColorFunction": "error",

    // 未知的属性。
    "sass.lint.unknownProperties": "warning",

    // 仅当支持 IE7 及更低版本时,才需要 IE hack
    "sass.lint.ieHack": "ignore",

    // 未知的供应商特定属性。
    "sass.lint.unknownVendorSpecificProperties": "ignore",

    // 因显示而忽略属性。例如,使用 "display: inline"时,宽度、高度、上边距、下边距和 float 属性将不起作用
    "sass.lint.propertyIgnoredDueToDisplay": "warning",

    // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
    "sass.lint.important": "ignore",

    // 避免使用“float”。浮动会带来脆弱的 CSS,如果布局的某一方面更改,将很容易破坏 CSS。
    "sass.lint.float": "ignore",

    // 选择器不应包含 ID,因为这些规则与 HTML 的耦合过于紧密。
    "sass.lint.idSelector": "ignore",

    //-------- Integrated terminal configuration --------

    // The path of the shell that the terminal uses on Linux.
    "terminal.integrated.shell.linux": "sh",

    // The path of the shell that the terminal uses on OS X.
    "terminal.integrated.shell.osx": "sh",

    // The path of the shell that the terminal uses on Windows.
    "terminal.integrated.shell.windows": "C:\\Windows\\system32\\cmd.exe",

    // The font family used by the terminal (CSS font-family format).
    "terminal.integrated.fontFamily": "Menlo, Monaco, Consolas, \"Droid Sans Mono\", \"Courier New\", monospace, \"Droid Sans Fallback\"",

    //-------- 外部终端配置 --------

    // Customizes which terminal to run on Windows.
    "terminal.external.windowsExec": "cmd",

    // Customizes which terminal to run on Linux.
    "terminal.external.linuxExec": "xterm",

    //-------- TypeScript 配置 --------

    // 指定包含要使用的 tsserver 和 lib*.d.ts 文件的文件夹路径。
    "typescript.tsdk": null,

    // 完成函数的参数签名。
    "typescript.useCodeSnippetsOnMethodSuggest": false,

    // 启用/禁用 TypeScript 验证
    "typescript.validate.enable": true,

    // 启用对发送到 TS 服务器的消息进行跟踪
    "typescript.tsserver.trace": "off",

    // 定义逗号分隔符后面的空格处理
    "typescript.format.insertSpaceAfterCommaDelimiter": true,

    // 在 For 语句中,定义分号之后的空格处理
    "typescript.format.insertSpaceAfterSemicolonInForStatements": true,

    // 定义二进制运算符后面的空格处理
    "typescript.format.insertSpaceBeforeAndAfterBinaryOperators": true,

    // 定义控制流语句中的关键字之后的空格处理
    "typescript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,

    // 定义匿名函数的函数关键字之后的空格处理
    "typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,

    // 定义非空圆括号的左括号之后和右括号之前的空格处理。
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,

    // 定义非空方括号的左括号之后和右括号之前的空格处理。
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,

    // 定义左大括号是否针对函数而放置在新的一行
    "typescript.format.placeOpenBraceOnNewLineForFunctions": false,

    // 定义左大括号是否针对控制块而放置在新的一行
    "typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,

    // 启用/禁用 JavaScript 验证
    "javascript.validate.enable": true,

    // 定义逗号分隔符后面的空格处理
    "javascript.format.insertSpaceAfterCommaDelimiter": true,

    // 在 For 语句中,定义分号之后的空格处理
    "javascript.format.insertSpaceAfterSemicolonInForStatements": true,

    // 定义二进制运算符后面的空格处理
    "javascript.format.insertSpaceBeforeAndAfterBinaryOperators": true,

    // 定义控制流语句中的关键字之后的空格处理
    "javascript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,

    // 定义匿名函数的函数关键字之后的空格处理
    "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,

    // 定义非空圆括号的左括号之后和右括号之前的空格处理。
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,

    // 定义非空方括号的左括号之后和右括号之前的空格处理。
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,

    // 定义左大括号是否针对函数而放置在新的一行
    "javascript.format.placeOpenBraceOnNewLineForFunctions": false,

    // 定义左大括号是否针对控制块而放置在新的一行
    "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,

    //-------- PHP 配置选项 --------

    // 不管 php 验证是否已启用。
    "php.validate.enable": true,

    // 指向可执行的 php。
    "php.validate.executablePath": null,

    // 不管 linter 是在 save 还是在 type 上运行。
    "php.validate.run": "onSave",

    // 启用基于字的建议。
    "editor.wordBasedSuggestions": true

}
点击阅读全文
上一篇:js控制右键菜单
下一篇:浅谈js中split() 方法的运用