This commit is contained in:
Alex Corbi 2019-09-30 10:44:43 +02:00
parent 36c5cc15a7
commit f972d8d46e
176 changed files with 62106 additions and 59068 deletions

View file

@ -1,32 +1,24 @@
# getSize
Get the size of elements. Used in [Masonry](https://masonry.desandro.com), [Isotope](https://isotope.metafizzy.co), & [Flickity](https://flickity.metafizzy.co).
Get the size of elements.
``` js
var size = getSize( elem );
// elem can be an element
var size = getSize( document.querySelector('.selector') )
// elem can be a selector string
var size = getSize('.selector')
var size = getSize( document.querySelector('#selector') )
// elem can be a string, used as a query selector
var size = getSize('#selector')
```
Returns an object with:
+ width, height
+ innerWidth, innerHeight
+ outerWidth, outerHeight
+ paddingLeft, paddingTop, paddingRight, paddingBottom
+ marginLeft, marginTop, marginRight, marginBottom
+ borderLeftWidth, borderTopWidth, borderRightWidth, borderBottomWidth
+ isBorderBox
Returns an object with: `width`, `height`, `innerWidth/Height`, `outerWidth/Height`, `paddingLeft/Top/Right/Bottom`, `marginLeft/Top/Right/Bottom`, `borderLeft/Top/Right/BottomWidth` and `isBorderBox`.
Browser support: IE10+, Android 4.0+, iOS 5+, and modern browsers
## Install
Install with npm: `npm install get-size`
Install with [Bower](http://bower.io): `bower install get-size`
Install with [Bower](https://bower.io): `bower install get-size`
Install with npm: `npm install get-size`
## Firefox hidden iframe bug
@ -42,4 +34,4 @@ Install with [Bower](https://bower.io): `bower install get-size`
## MIT License
getSize is released under the [MIT License](https://desandro.mit-license.org/).
getSize is released under the [MIT License](http://desandro.mit-license.org/).

View file

@ -1,17 +1,15 @@
{
"name": "get-size",
"description": "measures element size",
"version": "2.0.2",
"main": "get-size.js",
"authors": [
"David DeSandro"
],
"license": "MIT",
"keywords": [
"size",
"DOM"
],
"homepage": "https://github.com/desandro/get-size",
"description": "measures element size",
"dependencies": {
},
"devDependencies": {
"qunit": "~1.10"
},
"ignore": [
"test/",
"**/.*",
"package.json",
"node_modules",
@ -19,5 +17,21 @@
"test",
"tests",
"sandbox.html"
]
],
"homepage": "https://github.com/desandro/get-size",
"authors": [
"David DeSandro <desandrocodes@gmail.com>"
],
"moduleType": [
"amd",
"globals",
"node"
],
"keywords": [
"size",
"dom",
"width",
"height"
],
"license": "MIT"
}

View file

@ -1,17 +1,20 @@
/*!
* getSize v2.0.3
* getSize v2.0.2
* measure size of elements
* MIT license
*/
/* jshint browser: true, strict: true, undef: true, unused: true */
/* globals console: false */
/*jshint browser: true, strict: true, undef: true, unused: true */
/*global define: false, module: false, console: false */
( function( window, factory ) {
/* jshint strict: false */ /* globals define, module */
'use strict';
if ( typeof define == 'function' && define.amd ) {
// AMD
define( factory );
define( function() {
return factory();
});
} else if ( typeof module == 'object' && module.exports ) {
// CommonJS
module.exports = factory();
@ -86,7 +89,7 @@ function getStyle( elem ) {
if ( !style ) {
logError( 'Style returned ' + style +
'. Are you running this code in a hidden iframe on Firefox? ' +
'See https://bit.ly/getsizebug1' );
'See http://bit.ly/getsizebug1' );
}
return style;
}
@ -112,8 +115,8 @@ function setup() {
// -------------------------- box sizing -------------------------- //
/**
* Chrome & Safari measure the outer-width on style.width on border-box elems
* IE11 & Firefox<29 measures the inner-width
* WebKit measures the outer-width on style.width on border-box elems
* IE & Firefox<29 measures the inner-width
*/
var div = document.createElement('div');
div.style.width = '200px';
@ -125,11 +128,10 @@ function setup() {
var body = document.body || document.documentElement;
body.appendChild( div );
var style = getStyle( div );
// round value for browser zoom. desandro/masonry#928
isBoxSizeOuter = Math.round( getStyleSize( style.width ) ) == 200;
getSize.isBoxSizeOuter = isBoxSizeOuter;
getSize.isBoxSizeOuter = isBoxSizeOuter = getStyleSize( style.width ) == 200;
body.removeChild( div );
}
// -------------------------- getSize -------------------------- //