angular-element-metrics

Name Modified Size
README.md3 years ago2.09 KB
angular-element-metrics.js3 years ago959
angular-element-metrics.min.js3 years ago586
demo.html3 years ago4.86 KB

Angular Element Metrics

Angular Element Metrics is an AngularJS extension for elements that returns helpful size and coordinate details.

Usage

To use Angular Element Metrics, add the script to the head of your document.

<head>
    <script src="angular-element-metrics.js"></script>
</head>

That’s it. Use the metrics property on an element.

function ($scope, element, attrs) {
    var metrics = element.metrics();

    // Inspect the x,y coordinates of the element relative to the client (window).
    console.log(element.client);

    // Inspect the x,y coordinates of the element relative to the page (document).
    console.log(element.page);
}

Metrics

Image describing the CSS Box Model

Demo

See a metrics demonstration that tracks the size and coordinates of an element on the page.


The uncompressed script is 959 bytes, and the compressed script is 318 bytes.