HOWTO Find the Number of Pixels in a MM with Javascript

This is a simple trick to find the number of pixels in a millimeter using jQuery.

Code

function pixelsPerMM()
{
    $("body").append("<div id='onebyone' style='width:1mm;height:1mm;display:hidden;'></div>");
    var pixels = $("#onebyone").width();
    $("#onebyone").remove();
    return pixels;
}

How It Works

1. Adds a new element that is 1mm x 1mm to the page.
2. Requests the width (in pixels) of that element.
3. Deletes the element.

It is probably a good idea not to call this repeatedly in your code, as changing the web document in this manner is slow.

Why Use It

If you have an interface that you want to be exactly the same on every device, but you can't lay out the entire thing using CSS i.e. some elements are dynamically generated using Javascript, this would be a good method.