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?

Duplicate question. Check out: https://stackoverflow.com/questions/86428/what-s-the-best-way-to-reload-refresh-an-iframe — claudiu.nicola, Sep 07 '17 at 09:02

score 0 · Answer 1 · answered Sep 07 '17 at 09:25

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"

Reload iFrame on page resize using jQuery

1 Answers1