Pure JavaScript function similar to jQuery.offset()?

If document.getElementById("fb-root").clientHeight returns 0, it certainly means that your "fb-root" div is either not displayed or still empty.

I have had a look at fapi.js, and it seems that calling the FAPI.init function creates a span which id is "FAPI_Flash_wrap", appends it to the body of the document, then embeds a flash object with id "FAPI_Flash" in this span.

So I would try retrieving an element with id "FAPI_Flash_wrap" or "FAPI_Flash" instead of "fb-root":

<script type="text/javascript">
FAPI.init("http://api.odnoklassniki.ru/", "XXX_YYY",
function() {
    alert("Height = " + document.getElementById("FAPI_Flash_wrap").offsetHeight);
    alert("Width = " + document.getElementById("FAPI_Flash_wrap").offsetWidth);
    FAPI.UI.setWindowSize(720, 1200);
}, function(error){alert("API initialization failed");}
);
</script>
I hope this works!

If it's the case, then just use

<script type="text/javascript">
FAPI.init("http://api.odnoklassniki.ru/", "XXX_YYY",
function() {
    var height = document.getElementById("FAPI_Flash_wrap").offsetHeight;
    var width = document.getElementById("FAPI_Flash_wrap").offsetWidth;
    FAPI.UI.setWindowSize(width, height);
}, function(error){alert("API initialization failed");}
);
</script>

Quirksmode has a JavaScript tutorial/function that shows how to find the coordinates of an element here

Once you have its coordinates, you can use the offsetHeight property of the iframe to read its height.


Looking at the code in jquery, the offset is calculated like this:

function getOffset(element)
{
    if (!element.getClientRects().length)
    {
      return { top: 0, left: 0 };
    }

    let rect = element.getBoundingClientRect();
    let win = element.ownerDocument.defaultView;
    return (
    {
      top: rect.top + win.pageYOffset,
      left: rect.left + win.pageXOffset
    });   
}