HTML 頁面禁止縮放功能

頁面禁止縮放

代碼如下:

<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1.0,  user-scalable=no;"><meta name="theme-color" content="#000000"><title>頁面禁止縮放功能</title></head><!-- 禁止鼠標右鍵 oncontextmenu="return false"--><body oncontextmenu="return false"><noscript>You need to enable JavaScript to run this app.</noscript><script>const keyCodeMap = {// 91: true, // command61: true,107: true, // 數字鍵盤 +109: true, // 數字鍵盤 -173: true, // 火狐 - 號187: true, // +189: true, // -};// 覆蓋ctrl||command + ‘+’/‘-’document.onkeydown = function (event) {const e = event || window.event;const ctrlKey = e.ctrlKey || e.metaKey;if (ctrlKey && keyCodeMap[e.keyCode]) {e.preventDefault();} else if (e.detail) { // Firefoxevent.returnValue = false;}};// 禁止鼠標滑動縮放頁面document.body.addEventListener('wheel', (e) => {if (e.ctrlKey) {if (e.deltaY < 0) {e.preventDefault();return false;}if (e.deltaY > 0) {e.preventDefault();return false;}}}, { passive: false });// 觸摸屏禁止手動縮放頁面document.documentElement.addEventListener('touchstart', (event) => {if(event.touches.length > 1) {event.preventDefault();}},{passive: false}) </script></body>
</html>

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/90033.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/90033.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/90033.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

在github上搭建自己主頁

主要是這篇博客進行一些補充。 第一步照做就行 首先是第二步 克隆倉庫到本地 先下載一個git&#xff0c;電腦創建一個新文件夾&#xff0c;然后 git clone xxxxx 注意即使你使用了代理&#xff0c;這里大概率也會報錯&#xff0c;Failed to connect to github.com port 443 …

Laravel 框架NOAUTH Authentication required 錯誤解決方案-優雅草卓伊凡

Laravel 框架NOAUTH Authentication required 錯誤解決方案-優雅草卓伊凡NOAUTH Authentication required 錯誤這個錯誤通常出現在以下幾種情況&#xff1a;Redis 認證問題&#xff1a;如果你的應用使用了 Redis 且配置了密碼API 認證問題&#xff1a;請求需要認證的 API 端點但…

kafka生產端和消費端的僵尸實例以及解決辦法

目錄 一 生產端僵尸 1.1 原因 1.2 問題 1.3解決辦法 1.4 案例 1.4.1 案例1&#xff1a;生產者崩潰后重啟 (同一 transactional.id) 1.4.2 案例2&#xff1a;短暫網絡分區導致的腦裂 1.4.3 案例3&#xff1a;正確 - 解決僵尸 1.4.4 案例4&#xff1a;錯誤 - 無法解決僵…

國產電科金倉數據庫金倉KES V9 2025:AI時代的數據庫融合標桿

國產電科金倉數據庫金倉KES V9 2025&#xff1a;AI時代的數據庫融合標桿 在AI技術迅猛發展的今天&#xff0c;企業數據管理面臨著前所未有的挑戰&#xff1a;異構數據庫兼容難題、多數據模型融合需求、高并發場景性能瓶頸、跨中心容災壓力……這些痛點如同數據流轉的大問題&am…

【STM32】關于STM32F407寫Flash失敗問題的解決辦法

問題描述 在使用正點原子的STM32F407寫flash例程時&#xff0c;發現STMFLASH_Write函數沒辦法寫入數據到flash&#xff0c;原始代碼輸入下&#xff1a; 隨后對每一行代碼的結果進行分析&#xff0c;發現87行的“FLASH_ProgramWord(WriteAddr,*pBuffer)”返回值是7&#xff0c;一…

CUDA與RISC-V的融合:打破架構霸權,重塑AI計算未來

當x86和Arm統治數據中心十余年后,一家GPU巨頭正悄悄將十億顆RISC-V核心嵌入其系統。如今,它決定拆除CPU架構的圍墻。 2025年7月,上海張江科學會堂。英偉達硬件工程副總裁Frans Sijstermanns在第五屆RISC-V中國峰會上宣布:英偉達正式啟動CUDA向RISC-V架構的移植工作。 這個…

微信二維碼掃描登錄流程詳解

二維碼掃描登錄流程細節&#xff08;項目經驗&#xff09; 1&#xff1a; 獲取二維碼信息 PC會優先存放服務器生成的唯一密鑰&#xff1a; 比如 source、secret 以密文形式存儲大致發送字段&#xff1a; sourcesecretmac(mac 地址) 服務器生成 二維碼信息&#xff1a;二維碼字符…

日本上市IT企業|8月125日將在大連舉辦赴日it招聘會

株式會社GSD的核心戰略伙伴貝斯株式會社&#xff0c;將于2025年8月25日在大連香格里拉大酒店商務會議室隆重舉辦赴日技術人才專場招聘會。本次招聘會面向全國范圍內的優秀IT人才&#xff0c;旨在為貝斯株式會社東京本社長期發展招募優質的系統開發與管理人才。招聘計劃&#xf…

Python 數據分析與可視化:從基礎到進階的技術實現與優化策略

數據分析與可視化是數據科學領域的核心技能,Python 憑借其豐富的庫生態和靈活的編程范式,成為該領域的首選工具。本文將系統講解 Python 數據分析與可視化的技術棧實現,從基礎操作到性能優化,結合實戰場景提供可復用的解決方案。 數據分析核心庫技術解析 Pandas 數據處理…

Rust Web 全棧開發(十):編寫服務器端 Web 應用

Rust Web 全棧開發&#xff08;十&#xff09;&#xff1a;編寫服務器端 Web 應用Rust Web 全棧開發&#xff08;十&#xff09;&#xff1a;編寫服務器端 Web 應用創建成員庫&#xff1a;webappmodelshandlersrouterserrorsmodsvrstaticteachers.htmlregister.htmlbootstrap.m…

每日面試題11:JVM

深入理解JVM&#xff1a;Java的“心臟”如何驅動程序運行&#xff1f;為什么需要JVM&#xff1f;你是否想過&#xff0c;為什么用Java寫的程序&#xff0c;能在Windows、Linux、macOS上“無縫運行”&#xff1f;為什么開發者無需為不同操作系統重寫代碼&#xff1f;這背后的核心…

Linux網絡信息(含ssh服務和rsync)

73.telnet&#xff1a;測試端口連通性用法&#xff1a;telnet 主機名或IP 端口號測試目標主機的指定端口是否開放&#xff0c;檢查網絡服務連通性。eg&#xff1a;telnet www.baidu.com 80# 說明&#xff1a;# - 如果連接成功&#xff0c;顯示 "Connected to ..."。…

【PTA數據結構 | C語言版】我愛背單詞

本專欄持續輸出數據結構題目集&#xff0c;歡迎訂閱。 文章目錄題目代碼題目 作為一個勤奮的學生&#xff0c;你在閱讀一段英文文章時&#xff0c;是否希望有個程序能自動幫你把沒有背過的生詞列出來&#xff1f;本題就請你實現這個程序。 輸入格式&#xff1a; 輸入第 1 行給…

如何使用電腦連接小米耳機(紅米 redmi耳機)

如何使用電腦連接小米&#xff08;紅米 redmi&#xff09;耳機Redmi耳機連接電腦的具體步驟如下注意事項和常見問題解決方法&#xff1a;Redmi耳機連接電腦的具體步驟如下 打開耳機倉蓋&#xff1a; 首先&#xff0c;打開Redmi耳機的充電倉蓋&#xff0c;但不需要取出耳機。進…

排序算法—交換排序(冒泡、快速)(動圖演示)

目錄 十大排序算法分類?編輯 冒泡排序 算法步驟&#xff1a; 動圖演示&#xff1a; 性能分析&#xff1a; 代碼實現&#xff08;Java&#xff09;&#xff1a; 快速排序&#xff08;挖坑法&#xff09; 算法步驟&#xff1a; 動圖演示&#xff1a; 性能分析&#xff1…

2023 年 5 月青少年軟編等考 C 語言八級真題解析

目錄 T1. 道路 思路分析 T2. Rainbow 的商店 思路分析 T3. 冰闊落 I 思路分析 T4. 青蛙的約會 思路分析 T1. 道路 題目鏈接:SOJ D1216 N N N 個以 1 ~ N 1 \sim N 1~N 標號的城市通過單向的道路相連,每條道路包含兩個參數:道路的長度和需要為該路付的通行費(以金幣的數…

【vue-4】深入理解 Vue 3 中的 v-for 指令

Vue.js 作為現代前端框架的代表之一&#xff0c;其模板指令系統提供了強大的數據綁定和渲染能力。其中&#xff0c;v-for 指令是 Vue 中最常用且最重要的指令之一&#xff0c;它允許我們基于數據源循環渲染元素或組件。在 Vue 3 中&#xff0c;v-for 保留了一貫的簡潔語法&…

《R for Data Science (2e)》免費中文翻譯 (第1章) --- Data visualization(1)

寫在前面 本系列推文為《R for Data Science (2)》的中文翻譯版本。所有內容都通過開源免費的方式上傳至Github&#xff0c;歡迎大家參與貢獻&#xff0c;詳細信息見&#xff1a; Books-zh-cn 項目介紹&#xff1a; Books-zh-cn&#xff1a;開源免費的中文書籍社區 r4ds-zh-cn …

界面組件DevExpress WPF中文教程:Grid - 如何完成節點排序和移動?

DevExpress WPF擁有120個控件和庫&#xff0c;將幫助您交付滿足甚至超出企業需求的高性能業務應用程序。通過DevExpress WPF能創建有著強大互動功能的XAML基礎應用程序&#xff0c;這些應用程序專注于當代客戶的需求和構建未來新一代支持觸摸的解決方案。 無論是Office辦公軟件…

【Prometheus+Grafana篇】監控通過Keepalived實現的MySQL HA高可用架構

&#x1f4ab;《博主主頁》&#xff1a;    &#x1f50e; CSDN主頁__奈斯DB    &#x1f50e; IF Club社區主頁__奈斯、 &#x1f525;《擅長領域》&#xff1a;擅長阿里云AnalyticDB for MySQL(分布式數據倉庫)、Oracle、MySQL、Linux、prometheus監控&#xff1b;并對…