I've been trying to disable scrolling a page. All I have found are solutions of the type:
#container{
overflow: hidden;
}
But this just hides the scroll bar. How would I disable scrolling even with it being displayed on the screen ?
It does not matter if it will be css or other web technology client-side , I just want to know if there is any way.
You could use javascript to lock the scroll anyway, setting the top always to 0 , every time any scroll event is called, see:
function setTopo(){
$(window).scrollTop(0);
}
$(window).bind('scroll', setTopo);
And if you want to hide the scroll bar, you can apply the overflow: hidden; rule to your body.
You can not disable the scroll, but you can "fix" an element in the document, so the scroll will have no effect.
Something simple like:
div.fixed { position: fixed; top: 0; left: 0; }
In your HTML:
<div class="fixed"> ... conteúdo ... </div>
If the "fixed" element is the only element in your document, you have, in practice, eliminated the scrolling of the entire document. Combine this with what you already had, which hid the scrollbars, and that's it.
Reference: link
Involve your page in div with class specifies, for example:
<div class="wrap">Conteudo...</div>
And specify the height of all parent elements in 100% , so for example:
body, html {height:100%;}
and so:
div.wrap {height:100%; overflow:hidden;}
and set overflow hidden in body as well:
body {overflow: hidden; }
So you will not have scrolling ( scroll ) enabled on your page.
EDIT
I found the following CSS in the English OS:
html
{
position:fixed;
width:100%;
height:100%;
}
Hello, You can remove with the following command in javascript:
$(document).ready(function(){
// REMOVER BARRAS DE ROLAGEM
$("#SUADIV").click(function(){
$("html, body").css({
'height' : $(window).height() + 'px',
'width' : $(window).width() + 'px',
'overflow' : 'hidden'
});
});
});
It even identifies the size of your screen and removes the scrolls [X] and [Y], with CSS could remove
overflow-x:hidden; overflow-y:hidden; but the above jQuery commands already do.
Try this:
<body style="overflow:hidden;">
and come back to tell. ;) 0