基于jQuery解決ios10以上版本縮放問題
具體代碼如下所示:
<script type="text/javascript"> /*解決ios10以上版本縮放問題 20171102*/ window.onload=function () { document.addEventListener('touchstart',function (event) { if(event.touches.length>1){ event.preventDefault(); } }) var lastTouchEnd=0; document.addEventListener('touchend',function (event) { var now=(new Date()).getTime(); if(now-lastTouchEnd<=300){ event.preventDefault(); } lastTouchEnd=now; },false) } </script>
補充:下面看下ios10中禁止用戶縮放頁面
在ios10前我們能通過設置meta來禁止用戶縮放頁面:
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
在ios10系統(tǒng)中meta設置失效了:
為了提高Safari中網(wǎng)站的輔助功能,即使網(wǎng)站在視口中設置了user-scalable = no,用戶也可以手動縮放。
解決方法:監(jiān)聽事件來阻止
window.onload=function () { document.addEventListener('touchstart',function (event) { if(event.touches.length>1){ event.preventDefault(); } }) var lastTouchEnd=0; document.addEventListener('touchend',function (event) { var now=(new Date()).getTime(); if(now-lastTouchEnd<=300){ event.preventDefault(); } lastTouchEnd=now; },false) }
總結(jié)
以上所述是小編給大家介紹的基于jQuery解決ios10以上版本縮放問題,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
jQuery+slidereveal實現(xiàn)的面板滑動側(cè)邊展出效果
WEB開發(fā)中有時需要在頁面上設置一個控制面板,默認是不顯示的,當用戶有需要時可以通過按鈕觸發(fā)調(diào)用面板展示。常見的有頁面?zhèn)冗吇雒姘逍Ч?。本文將使用jQuery插件并結(jié)合實例給大家介紹一下面板滑動展示效果。2015-03-03解決jquery validate 驗證不通過后驗證正確的信息仍殘留在label上的方法
在本篇文章里小編給大家整理了關(guān)于解決jquery validate 驗證不通過后驗證正確的信息仍殘留在label上的方法,有需要的朋友們可以學習下。2019-08-08jQuery實現(xiàn)仿美橙互聯(lián)兩級導航菜單的方法
這篇文章主要介紹了jQuery實現(xiàn)仿美橙互聯(lián)兩級導航菜單的方法,實例分析了jQuery操作css及setTimeout等實現(xiàn)導航菜單的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03淺談MVC+EF easyui dataGrid 動態(tài)加載分頁表格
下面小編就為大家?guī)硪黄獪\談MVC+EF easyui dataGrid 動態(tài)加載分頁表格。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-11-11jQuery動態(tài)添加<input type="file">
有時候需要在頁面上允許用戶上傳多個文件,個數(shù)由用戶自己決定,個數(shù)多了也可以刪除,使用jQuery可以很簡單的實現(xiàn)這個功能2016-04-04在jQuery ajax中按鈕button和submit的區(qū)別分析
昨天在使用jQuery ajax的post方法進行頁面?zhèn)髦?,無刷新獲取數(shù)據(jù)展示,弄了半天就是沒有效果,看了半天也沒有語法錯誤,最后才終于明白問題出在哪里2012-10-10jQuery+CSS實現(xiàn)的table表格行列轉(zhuǎn)置功能示例
這篇文章主要介紹了jQuery+CSS實現(xiàn)的table表格行列轉(zhuǎn)置功能,涉及jQuery事件響應及頁面元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2018-01-01關(guān)于jQuery.ajax()的jsonp碰上post詳解
這篇文章主要介紹了關(guān)于jQuery.ajax()的jsonp碰上post的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家具有一定的參考學習價值,需要的朋友們下面來一起看看吧。2017-07-07