2

I need to disable a scroll in my HTML page on Chrome. I write the overflow:hidden so that hide the scroll bar and disable mouse wheel in Firefox and Internet Explorer. It still be possible to scroll in firefox with the click on mouse wheel but I don't care about that.

So the overflow:hidden just hidden the scrollbar in Chrome but we can still scroll with the mouse wheel.

I make a JSFiddle here but it throws some bugs with his own scroll bar so I recommend to you to create this simple html script to try:

<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>

So how can we disable the scroll in chrome? Just for information I plan to make an Android application that's why Chrome is important to me.

EDIT: Chrome bug on my computer so tests aren't good but if you have an android you can navigate to my page here and you will notice the bug: you can scroll with your finger.

4

2 回答 2

1

如果它不能overflow:hidden单独使用，也可以使用窗口高度：

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

以下是在 Android Chrome 浏览器中禁用滚动的方法：

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

当然，您可以使用 再次启用它document.removeEventListener。

于 2014-11-08T21:01:25.187 回答
0

尝试

更新

图片 在此处输入图像描述

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-17T10:36:25.560 回答