Advertisement
Gordon___From

Get scrollbar width function

Nov 3rd, 2014
147
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function getScrollbarWidth() {
  2.     var outer, inner, widthScollbar, widthNoScrollbar;
  3.  
  4.     outer = $('<div>', {
  5.         id: '__outer',
  6.         css: {
  7.             'visibility': 'hidden',
  8.             'width': '100px'
  9.         }
  10.     }).appendTo('body');
  11.  
  12.     widthScollbar = outer.outerWidth();
  13.     // force scrollbars
  14.     outer.css('overflow', 'scroll');
  15.  
  16.     inner = $('<div>', {
  17.         id: '__outer',
  18.         style: {
  19.             'width': '100%'
  20.         }
  21.     }).appendTo('#__outer');
  22.  
  23.     // add innerdiv
  24.     widthNoScrollbar = inner.outerWidth();
  25.  
  26.     console.log(widthScollbar, widthNoScrollbar);
  27.     // remove divs
  28.     outer.remove();
  29.  
  30.     return widthNoScrollbar - widthScollbar;
  31. }
  32.  
  33. $('body').text('ScrollbarWidth: ' + getScrollbarWidth() );
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement