465 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 1+ members
  • Has sold $125,000+ on Envato Market
  • Has collected 100+ items on Envato Market
+5 more
CurtyCurt says

I am trying to disable scolling on a page after it has already loaded

IE this works fine

document.body.scroll = "no";

and this works for firefox

document.body.style.overflow = "hidden";

however when I set the overflow on the body after the page has already loaded, in firefox, the entire page actually reloads. Anyone know how to get around this.

155 posts
  • Has been part of the Envato Community for over 4 years
  • Located in Canada
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
Warll says

How about you add this using javascript once the dom is ready?

body { height: 100%; overflow: hidden; }

Or are you trying to do something else?

465 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 1+ members
  • Has sold $125,000+ on Envato Market
  • Has collected 100+ items on Envato Market
+5 more
CurtyCurt says

nope, the page has already totally rendered, and I want to set a button click to disable the scroll bars, but for some reason when I make a call to javascript to do this,

document.body.style.overflow = "hidden";

the whole page re-renders

155 posts
  • Has been part of the Envato Community for over 4 years
  • Located in Canada
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
Warll says

How you tried it the manual way, ie write your own simple function to give body the proper css rules?

1032 posts Best-dressed man at PressNomics 2013
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
  • Power Elite Author: Sold more than $1M on Envato Market
  • Has sold $1M+ on Envato Market and is now a Power Elite Author
+10 more
Parallelus says
nope, the page has already totally rendered, and I want to set a button click to disable the scroll bars, but for some reason when I make a call to javascript to do this,
document.body.style.overflow = "hidden";
the whole page re-renders

Are you sure the button doesn’t have a target? What I mean is something like a link tag with an empty HREF value, or a submit button on a form that posts back to the same page?


<a href="" onclick="document.body.style.overflow='hidden';">
    Remove Scrollbars
</a>

That would reload the page. But using a true button (or adding “return false;” after the onclick command) will only execute the javascript and nothing else:


<!-- using a link -->
<a href="#" onclick="document.body.style.overflow='hidden'; return false;">
    Remove Scrollbars
</a>

<!-- using a button -->
<button onclick="document.body.style.overflow='hidden';">
    Remove Scrollbars
</button>

Can you post the full code for the button you are creating?

629 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
VagrantRadio says
I am trying to disable scolling on a page after it has already loaded

IE this works fine

document.body.scroll = "no";

and this works for firefox

document.body.style.overflow = "hidden";
however when I set the overflow on the body after the page has already loaded, in firefox, the entire page actually reloads. Anyone know how to get around this.

Using jQuery would be much simpler.

$("#button").click(function() {
$("body").css("overflow", "hidden");
}, function() {
$("body").css("overflow", "auto");
});
465 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 1+ members
  • Has sold $125,000+ on Envato Market
  • Has collected 100+ items on Envato Market
+5 more
CurtyCurt says

Thanks for the post guys. Actually this is a flash button that when clicked uses External Inteface to call javascript, and that javascript function disables the scrollbar, but for some reason when javascript changes the overflow property on any element it actually refreshes the page like an empty a-tag. I am baffled by this. I tried it with the jquery way as well and it has the same effect.

659 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 50+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+3 more
luckykind says

It’s hard to tell without seeing code… but with whatever your clicking (eg. anchor tag, button tag, etc.) are you also adding after it:

return false;

?

629 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
VagrantRadio says
It’s hard to tell without seeing code… but with whatever your clicking (eg. anchor tag, button tag, etc.) are you also adding after it: return false; ?

+1

by
by
by
by
by
by