Reload iFrame on page resize using jQuery

Question

I have iframe (pdf file) using filestream from controller:

 <iframe id="#f1" src="@Url.Action("fileStream", "Approve", new { EAN = Model.ID_EAN })" style="min-height:500px; max-height:100%; min-width:100%;" frameborder="0"></iframe>

And I need to reload this iframe on page resize.

So I created jQuery function:

jQuery(function($) {
    var windowWidth = $(window).width();
    var windowHeight = $(window).height();

    $(window).resize(function() {
        if (windowWidth != $(window).width() || windowHeight != $(window).height()) {
            $('#f1').attr('src', $('#f1').attr('src'));
            return;
        }
    });
});

But it doesn't work. Could you pleas suggest me solution?

Answer 1

Solution

jQuery(function ($) {
            var windowWidth = $(window).width();
            var windowHeight = $(window).height();

            $(window).resize(function () {
                if (windowWidth != $(window).width() || windowHeight != $(window).height()) {
                    window.frames['here'].location.reload();
                    return;
                }
            });
        });

And iframe have name="here"