Skip to content

Instantly share code, notes, and snippets.

@lutzissler
Created September 6, 2014 06:33
Show Gist options
  • Save lutzissler/97f81c9f3aefdf7700e8 to your computer and use it in GitHub Desktop.
Save lutzissler/97f81c9f3aefdf7700e8 to your computer and use it in GitHub Desktop.
Feature test for hidden scrollbars (e. g. on Mac OS). Adopted from http://davidwalsh.name/detect-scrollbar-width and https://github.com/Modernizr/Modernizr/blob/d6e1d6f09e1f8250eca9116bcffe2f846616afa7/feature-detects/hiddenscroll.js. Usage: Plug it in and see the class "hiddenscroll" being added to the html element if scrollbars are hidden.
(function ($) {
$(function () {
var el = $('<div style="width:100px;height:100px;overflow:scroll;position:absolute;top:-9999px;"/>'),
elDom = el.get(0);
el.appendTo("body");
if (elDom.offsetWidth === elDom.clientWidth) {
$("html").addClass("hiddenscroll");
}
el.remove();
});
})(jQuery);
@MorrisJohns
Copy link

FYI: Internet Explorer Edge (IE12!) on Win10 dynamically sets the scrollbar width to zero when you go into Tablet Mode, and shows the scrollbar again when you leave Tablet Mode. I think you can detect the mode change by registering for a resize event.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment