禁用手機的水平滾動

我希望禁用移動設備的垂直滾動。使用：禁用手機的水平滾動

body {overflow-x:hidden}

作品進行正常的瀏覽器，但在移動設備上，如果有一個元素大於屏幕就會讓側滾動更寬。

我已經使用此代碼嘗試：

jQuery(document).ready(function($) { 
    var $body = $(document); 
    $body.bind('scroll', function() { 
     // "Disable" the horizontal scroll. 
     if ($body.scrollLeft() !== 0) { 
      $body.scrollLeft(0); 
     } 
    }); 
});

但它允許側滾動（移動），但「跳躍」滾動回到正確的，這不是一個完美的解決方案。

我一直在使用這種嘗試：

<meta name="viewport" content=" width=device-width; initial-scale=1.0; user-scalable=0;" /> 
$(document).bind("touchmove",function(event){ 
      event.preventDefault(); 
     });

這個完美的作品，並禁用移動完全滾動，問題是，它是禁用水平和垂直滾動（我想只禁止水平）。

來源

2015-04-30 user3003106

我沒有看到該帖子 – user3003106

http://stackoverflow.com/questions/10592411/disable-scrolling-in-all-mobile-devices任何的jQuery/js的解決方案 –

用於觸控設備的Javascript解決方案 - https://jsfiddle.net/6492jvb0/ – Tasos

試試這個：

html, body { 
    overflow-x: hidden; 
} 
body { 
    position: relative 
}

來源

2015-04-30 10:36:12

在某些情況下，這對我更好用：html，body {max。width：100％！important; overflow-x：hidden！important; } – user3003106

沒錯。令人驚訝的設置溢出到身體只工作。只有html + body –

禁用手機的水平滾動

回答

相關問題