移動端瀏覽器click的300ms延遲問題

時間 2019-11-09

原文原文鏈接

　　此時，徹底禁止縮放了，例如，想放大查看某張圖片也是不被容許的javascript

　　適用場景：無需用戶放大查看的元素頁面、遊戲頁面等（注：ios10之前，上面是有效的）html

1 <meta name="viewport" content="width=device-width">

　　它只是去除了雙擊縮放，縮放功能並不是被徹底禁用，但用戶仍可使用雙指縮放。java

通常都是聯合着一塊兒寫：ios

1 <meta
2       name="viewport"
3       content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
4 />

　　從IOS10開始，蘋果開始容許用戶強制雙擊縮放（其實，並非均可以縮放，好像只是針對圖片，會有一個雙擊放大再次復原的效果） => 那麼，能夠用上面這條meta語句應付了，至於還想禁止雙指縮放，則須要js了。git

　　觸摸動做也常常用於徹底解決由支持雙擊縮放手勢引發的點擊事件的延遲。github

1 html {
2   touch-action: manipulation; // 值爲none時，禁用元素（及其不可滾動的後代）上的全部手勢
3 }

　　manipulation只容許進行滾動和持續縮放操做。啓用平移和縮小縮放手勢，但禁用其餘非標準手勢，例如雙擊以進行。瀏覽器

　　FastClick 是 FT Labs 專門爲解決移動端瀏覽器 300 毫秒點擊延遲問題所開發的一個輕量級的庫。spa

　　FastClick 使用方法: 在 window load 事件以後，在 <body> 上調用 FastClick.attach() 。scala

 
window.addEventListener( "load", function() {
   FastClick.attach( document.body );
}, false ); 
  

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。