Hide Scrollbars Using Javascript

One issue I came across while doing one of my projects was to hide the scrollbars of a popup window. Yeah, sure, it is easy if you add the attribute scrollbars=no inside the window.open()‘s window attributes. But what if you wish to hide them when the popup window is already open. Thank you CSS! Yes, it is possible by using Javascript and accessing the window style’s property overflow. However, there is a cross-browser issue. Both IE and Firefox/Google Chrome have different codes that make this work. You can place both their codes in the same page and/or Javascript function. If the browser does not understand the property, it will ignore it anyway so there is no need to do a browser check to execute the code specific to that certain browser.

The code below does the trick

?View Code JAVASCRIPT
1
2
document.documentElement.style.overflow = 'hidden';	 // firefox, chrome
document.body.scroll = "no";	// ie only

Just in case you wish to disable either just the horizontal or vertical scrollbar, this code works for non IE browsers

?View Code JAVASCRIPT
1
2
document.documentElement.style.overflowX = 'hidden';	 // horizontal scrollbar will be hidden
document.documentElement.style.overflowY = 'hidden';	 // vertical scrollbar will be hidden

Donations appreciated. Every little $ helps. Or click Google +1

Related Posts with Thumbnails

tags: ,

6 Responses to “Hide Scrollbars Using Javascript”

Pages: « 1 [2] Show All

  1. 6
    ico Says:

    Thanks man, it works for Google Chrome~!

Pages: « 1 [2] Show All

Leave a Reply

Spam protection by WP Captcha-Free