javascriptmatchmedia

Fake a window resize, to make all resize-only JavaScript load

Let’s say I had JavaScript that runs when the window is resized, but if you use window.load or document.ready it doesn’t work. (My situation).

I’m not looking for window.load or document.ready (jQuery) alone... I’m looking to literally fake a window resize... to make the resize-only scripts load.

How can I fake a window resize, without resizing the window?

Solution

  • Just call $(window).trigger('resize'); it will trigger a resize and whatever you register on the resize will be called.

    $(window).resize(function() {
  alert("Work done when resize is being called");
});

$(window).resize(function() {
  alert("More work");
});

$("*").click(function(){
  alert("Triggering resize");
  $(window).trigger('resize');
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Click anywhere to trigger the resize