How to resize iframe when parent window resizes

Question

I don\'t think this is not another \"resize iframe according to content height\" question.

I actually want to resize the iframe dynamically according to a resize of the

Answer 1

I think this does what you're after.

First I wrapped the iframe in a div, and set the iframe's width and height to be 100%.

HTML

CSS

#frameContainer {

    margin: 40px;
    position: fixed;
    top: 80px;
    left: 0px;
    width: 200px;
    bottom: 25px;
    min-width: 200px;

}

iframe#frame2 { width: 100%; height:100% }

Then I added the following jQuery code.

jsFiddle

$(function() {
    var widthRatio = $('#frameContainer').width() / $(window).width();
    $(window).resize(function() {
        $('#frameContainer').css({width: $(window).width() * widthRatio});
    }); 
});