在Chrome中禁用滾動

我需要在我的HTML頁面上禁用滾動。我寫溢出：隱藏，以便隱藏滾動條並禁用Firefox和Internet Explorer中的鼠標滾輪。它仍然可以滾動在Firefox中點擊鼠標滾輪，但我不關心這一點。在Chrome中禁用滾動

所以溢出：隱藏只是隱藏在Chrome中的滾動條，但我們仍然可以滾動鼠標滾輪。

我做的jsfiddle here，但它會拋出一些錯誤與他自己的滾動條，所以我建議你創建這個簡單的HTML腳本嘗試：

<html> 
<head> 
<style> 
body{ 
overflow:hidden; 
} 

div{ 
height:2000px; 
width:1300px; 
position: relative; 
background-image:linear-gradient(blue, red); 
} 
</style> 
</head> 
<body> 
<div></div> 
<span>Test</span> 
</body> 
</html>

那麼，如何才能禁用鉻滾動？僅供參考，我打算製作一個Android應用程序，這就是爲什麼Chrome對我很重要。

編輯︰我的電腦上的Chrome錯誤，所以測試不好，但如果你有一個機器人，你可以導航到我的頁面here，你會注意到這個錯誤：你可以用你的手指滾動。

來源

2013-07-17 Podelo

我檢查鉻和沒有問題..哪些版本是你使用..可以顯示你的問題的屏幕截圖 –

更新你的鉻版本它工作正常 – Amol

我有這個版本28.0.1500.72米，它似乎是到目前爲止 – Podelo

嘗試

UPDATE

圖片 enter image description here

HTML

<div id="wrapper"> 

<div></div> 
    </div> 
<span>Test</span>

CSS：

#wrapper 
{ 
    margin: 0 auto; 
position: relative; 
height:580px; 
} 

body { 
    min-height: 580px; 
    overflow: hidden; 
} 

div{ 
    height:2000px; 
    width:1300px; 
    position: relative; 
    background-image:linear-gradient(blue, red); 
} 

html { 
    overflow: auto; 
}

來源

2013-07-17 10:36:25

感謝您的答案，但它不工作，並在更多的使滾動條可見 – Podelo

更改包裝和身體最小高度爲580px –

檢查我更新的答案 –

如果它不與overflow:hidden單獨工作，只需要使用窗口高度太：

document.getElementById('yourDivId').style.height = window.innerHeight + 'px';

Here's如何禁用在Android瀏覽器Chrome的滾動：

document.addEventListener('touchmove', function(evt) { 
    evt.preventDefault(); 
});

當然，你可以通過document.removeEventListener再次啓用它。

來源

2014-11-08 21:01:25 luschn

在Chrome中禁用滾動

回答

相關問題