├── .gitignore
├── LICENSE
├── README.md
├── index.js
├── package.json
└── test
    └── test.js


/.gitignore:
--------------------------------------------------------------------------------
1 | .idea/
2 | node_modules/
3 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2016 Jam3
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # scroll-bar-width
 2 | Detect browser scroll bar width (e.g. 15px on Mac, 25px on Windows etc)
 3 | 
 4 | ## Example
 5 | ```javascript
 6 | 
 7 | var scrollBarWidth = require('scroll-bar-width');
 8 | 
 9 | // initialize it once in your code
10 | scrollBarWidth.init();
11 | 
12 | // get the width
13 | var width = scrollBarWidth.get();
14 | 
15 | console.log(width) // ----> 25px on Windows
16 | ```
17 | 
18 | ## Install
19 | ```sh
20 | npm install scroll-bar-width --save
21 | ``` 
22 |  
23 | ## Test
24 | ```sh
25 | npm t
26 | ```
27 | NOTE: Test requires [beefy](http://didact.us/beefy/) to be installed globally.
28 | 
29 |  
30 | ## License
31 | MIT, see [LICENSE.md](http://github.com/Jam3/scroll-bar-width/blob/master/LICENSE) for details.
32 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | var scrollBarWidth;
 2 | 
 3 | module.exports = {
 4 | 
 5 |   init: function () {
 6 |     var scrollDiv = document.createElement('div');
 7 |     scrollDiv.style.width = '100px';
 8 |     scrollDiv.style.height = '100px';
 9 |     scrollDiv.style.overflow = 'scroll';
10 |     scrollDiv.style.position = 'absolute';
11 | 
12 |     document.body.appendChild(scrollDiv);
13 |     scrollBarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
14 |     document.body.removeChild(scrollDiv);
15 |   },
16 | 
17 |   get: function () {
18 |     return scrollBarWidth;
19 |   }
20 | };
21 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "scroll-bar-width",
 3 |   "version": "0.0.4",
 4 |   "description": "Detect browser scroll bar width.",
 5 |   "main": "index.js",
 6 |   "license": "MIT",
 7 |   "author": {
 8 |     "name": "Vadim Namniak",
 9 |     "email": "vadim@jam3.com",
10 |     "url": "https://github.com/namniak"
11 |   },
12 |   "dependencies": {
13 |   },
14 |   "devDependencies": {},
15 |   "scripts": {
16 |     "test": "beefy ./test/test.js --live --open"
17 |   },
18 |   "keywords": [
19 |     "scroll-bar",
20 |     "scroll-bar-width"
21 |   ],
22 |   "repository": {
23 |     "type": "git",
24 |     "url": "git:github.com/Jam3/scroll-bar-width.git"
25 |   },
26 |   "homepage": "https://github.com/Jam3/scroll-bar-width",
27 |   "bugs": {
28 |     "url": "https://github.com/Jam3/scroll-bar-width/issues"
29 |   }
30 | }
31 | 


--------------------------------------------------------------------------------
/test/test.js:
--------------------------------------------------------------------------------
 1 | var scrollBarWidth = require('../index.js');
 2 | 
 3 | var body = document.getElementsByTagName('body')[0];
 4 | body.style.position = 'absolute';
 5 | body.style.overflow = 'hidden';
 6 | body.style.width = '100%';
 7 | body.style.height = '100%';
 8 | body.style.margin = '20px';
 9 | 
10 | scrollBarWidth.init();
11 | 
12 | var txt = document.createElement('div');
13 | txt.innerHTML = 'Scroll bar width is: ' + scrollBarWidth.get() + 'px';
14 | document.body.appendChild(txt);


--------------------------------------------------------------------------------