91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

如何解決移動端禁止雙指縮放功能的問題

發布時間:2021-09-26 16:49:04 來源:億速云 閱讀:1102 作者:小新 欄目:開發技術

這篇文章主要介紹了如何解決移動端禁止雙指縮放功能的問題,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

  做移動端開發,給頁面頭部添加了meta標簽,并添加了user-scalable=no屬性禁止雙指或雙擊放大:在實際開發中,我們禁止縮放的實現方式:

  禁止雙指縮放meta設置:

  <metaname="viewport"content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=0"/>

  user-scalabel=no或者user-scalabel=yes(yes是可以縮放,no或者0是不能縮放)

  在ios10以上的系統中,并不支持meta標簽,需要我們通過腳本實現:

  window.addEventListener(

   "touchmove",

   function(event){

    if(event.scale!==1){

     event.preventDefault();

    }

   },{

    passive:false

   }

  );

  注意:禁用雙指縮放后,scroll事件需要重新綁定,滾動條的事件監聽touchmove,touchstart,touchend;

  禁止雙指縮放解決方法

  <metaname="viewport"content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">

  但有些移動端瀏覽器,比如IOS10以上的Safari,安卓系統下的UC瀏覽器、QQ瀏覽器等,為了更好的用戶體驗,并沒有遵循開發者禁止縮放的指定,雖然meta標簽按如上寫法,但依然允許用戶雙指縮放和雙擊放大。

  解決方法是再加一段js,通過touchmove事件判斷多個手指(touches.length),并通過阻止事件冒泡event.preventDefault()來實現。

  寫了個demo,大家可以參考,點這里可以在線預覽:禁止移動端個別瀏覽器縮放

  PS:實測UC瀏覽器在我們多次雙指操作后,還是會突破我們的限制,實現系統級強制對頁面按照用戶的意愿雙指縮放,淘寶、天貓等大廠的站也是一樣,所以,通過web代碼,完全實現禁止用戶縮放,目前是無法實現的。心疼前端兄弟們一秒鐘。。。

  <!DOCTYPEhtml>

  <htmllang="en">

  <head>

  <metacharset="UTF-8">

  <metaname="viewport"content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">

  <title>禁止移動端某些瀏覽器縮放</title>

  </head>

  <body>

  <div>孫琪崢博客<br>www.sunqizheng.com<br/>用兩個手指試下,不能縮放哦!</div>

  <style>

  *{

  padding:0;

  margin:0;

  }

  html,

  body{

  width:100%;

  height:100%;

  }

感謝你能夠認真閱讀完這篇文章,希望小編分享的“如何解決移動端禁止雙指縮放功能的問題”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,更多相關知識等著你來學習!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

嘉黎县| 老河口市| 黄梅县| 扶余县| 开化县| 嘉善县| 长春市| 花莲县| 老河口市| 兴城市| 班戈县| 枝江市| 霸州市| 古蔺县| 右玉县| 古田县| 上林县| 兴隆县| 兰西县| 濉溪县| 无极县| 德安县| 新乡县| 施甸县| 永胜县| 当阳市| 浙江省| 丽水市| 汉沽区| 大邑县| 连州市| 恩施市| 寿阳县| 金阳县| 东明县| 杭锦后旗| 台南县| 许昌市| 杭锦旗| 正阳县| 温泉县|