[SOLVED] is it possible that iframe resize itself without help from main window?

is it possible that iframe resize itself without help from main window?

Both main window and iframe are on the same domain, but what I want to achieve is to resize iframe to fit its contents using js only within that iframe.

I also do not know the id of the iframe that is assigned to it by main window. And I do not want to use jquery or any other framework for it.

Solution

You can do this also without knowing the idof the iframe in the parent window:

window.frameElement.style.width = iframeContentWidth + 'px';
window.frameElement.style.height = iframeContentHeight + 'px';

See frameElement at MDN.

EDIT

Just in case the iframe happens to be in a container element which has fixed size and overflow: hidden you can do something like this:

function resizeIframe (iframeContentWidth, iframeContentHeight) {
    var container = window.frameElement.parentElement;
    if (container != parent.document.body) {
        container.style.width = iframeContentWidth + 'px';
        container.style.height = iframeContentHeight + 'px';
    }
    window.frameElement.style.width = iframeContentWidth + 'px';
    window.frameElement.style.height = iframeContentHeight + 'px';
    return;
}