Provide the traditional dimension methods as jQuery Slim.
It is suggested to use it with Vanilla JS, Bliss, or Cash.
Remarks: jQuery's implementation on dimension APIs is very nice!
- jqDim.reliableTrDimensionsVer = 1
jQuery 3.6.0 ~ 3.7.1 (see jquery/jquery#5270)
- jqDim.reliableTrDimensionsVer = 2
<script src="https://cdn.jsdelivr.net/gh/cyfung1031/[email protected]/release/jqDim-3.7.1.min.js"></script>
<a href="javascript:void(0);" onclick="ShowElementDimensions();">Show element dimensions</a>
<div id="divTestArea1" style="height: 100px; width: 400px; padding: 20px; margin: 3px; border: 1px solid silver; background-color: #eee;"></div>
<script type="text/javascript">
function ShowElementDimensions()
{
let elm = document.querySelector("#divTestArea1")
var result = "";
let dim = window.jqDim(elm)
result += "Dimensions of div: " + dim.width() + "x" + dim.height() + "</br>";
result += "Inner dimensions of div: " + dim.innerWidth() + "x" + dim.innerHeight() + "</br>";
result += "Outer dimensions of div: " + dim.outerWidth() + "x" + dim.outerHeight() + "</br>";
result += "Outer dimensions of div (with margin): " + dim.outerWidth(true) + "x" + dim.outerHeight(true) + "</br>";
(elm).innerHTML=result;
}
</script>
Size | jDim 3.6.0 | Bliss | Cash 8.1.0 | jQuery Slim 3.6.0 |
---|---|---|---|---|
Unminified | 27.1 KB | 21.1 KB | 36.5 KB | 229 KB |
Minified | 5.97 KB | 10.7 KB | 16 KB | 70.6 KB |
Minified & Gzipped | 2.59 KB | 3 KB | 6 KB | 24.4 KB |
Size | jDim + Bliss | jDim + Cash | jQuery Slim 3.6.0 |
---|---|---|---|
Unminified | 48.2 KB | 57.6 KB | 229 KB |
Minified | 16.7 KB | 22 KB | 70.6 KB |
Minified & Gzipped | 5.59 KB | 8.59 KB | 24.4 KB |
- jqDim is minified by Andrew Chilton's JavaScript Minifier
- .offset()
- .position()
- .scrollTop()
- .scrollLeft()
- .width()
- .height()
- .innerWidth()
- .innerHeight()
- .outerWidth()
- .outerHeight()
- .outerWidth(true)
- .outerHeight(true)
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|---|
15+ ✔ | 51+✔ | 45+✔ | ✖ | 38+✔ | 10+ ✔ |
jQuery JavaScript Library v3.7.1 -ajax,-ajax/jsonp,-ajax/load,-ajax/script,-ajax/var/location,-ajax/var/nonce,-ajax/var/rquery,-ajax/xhr,-manipulation/_evalUrl,-deprecated/ajax-event-alias,-effects,-effects/Tween,-effects/animatedSelector
Copyright OpenJS Foundation and other contributors
Released under the MIT license
Date: 2021-03-02T17:08Z