基于jQuery解決ios10以上版本縮放問題
更新時(shí)間：2017年11月03日 10:52:45 作者：yangzailu1990
本文通過一段示例代碼給大家介紹了基于jQuery解決ios10以上版本縮放問題，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
具體代碼如下所示：
<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>
補(bǔ)充：下面看下ios10中禁止用戶縮放頁面
在ios10前我們能通過設(shè)置meta來禁止用戶縮放頁面：
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
在ios10系統(tǒng)中meta設(shè)置失效了：
為了提高Safari中網(wǎng)站的輔助功能，即使網(wǎng)站在視口中設(shè)置了user-scalable = no，用戶也可以手動(dòng)縮放。
解決方法：監(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以上版本縮放問題，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
jquery實(shí)現(xiàn)企業(yè)定位式導(dǎo)航效果
這篇文章主要介紹了jquery實(shí)現(xiàn)企業(yè)定位式導(dǎo)航效果2018-01-01
這篇文章主要介紹了jquery判斷元素是否隱藏的多種方法,本文總結(jié)了多種判斷方法實(shí)例,需要的朋友可以參考下2014-05-05
jquery實(shí)現(xiàn)的table排序功能示例
這篇文章主要介紹了jquery實(shí)現(xiàn)的table排序功能,涉及基于jQuery的頁面元素屬性動(dòng)態(tài)操作及鼠標(biāo)事件響應(yīng)相關(guān)技巧,需要的朋友可以參考下2017-03-03
jQuery實(shí)現(xiàn)鼠標(biāo)經(jīng)過時(shí)高亮,同時(shí)其他同級(jí)元素變暗的效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)經(jīng)過時(shí)高亮,同時(shí)其他同級(jí)元素變暗的效果,涉及jQuery基于事件響應(yīng)機(jī)制的頁面元素遍歷與屬性變換操作技巧,需要的朋友可以參考下2016-09-09
這篇文章主要介紹了jQuery xml字符串的解析、讀取及查找方法,涉及jQuery方法針對(duì)xml字符串的解析、讀取及遍歷查詢等操作相關(guān)技巧,需要的朋友可以參考下2016-03-03
jQuery 使用手冊，大家可以耐心的看完，就基本上入門了。2009-09-09
這篇文章主要介紹了Jquery ajax書寫方法代碼實(shí)例解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-06-06
jQuery簡單實(shí)現(xiàn)向列表動(dòng)態(tài)添加新元素的方法示例
這篇文章主要介紹了jQuery簡單實(shí)現(xiàn)向列表動(dòng)態(tài)添加新元素的方法,涉及jQuery事件響應(yīng)及頁面元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-12-12
jquery拖動(dòng)插件(jquery.drag)使用介紹
可以使用鼠標(biāo)任意拖動(dòng)列表項(xiàng)改變默認(rèn)的位置，具體的實(shí)現(xiàn)如下(附演示)，感興趣的朋友可以學(xué)習(xí)下2013-06-06
根據(jù)郵箱的域名跳轉(zhuǎn)到相應(yīng)的登錄頁面的代碼
其實(shí)主要是想記錄一下這種對(duì)象的用法，喜歡的朋友可以參考下2012-02-02