How to unload jQuery plugins after window resize?

Question

I have 2 jquery plugins for navigation menu, one is for smaller screens and the another one is for bigger screens, i used this code:

if (screen.width < 1024) {
        $(document).ready(function() {
            $("#my-menu").mmenu();
            $("#my-button").click(function() {
                $("#my-menu").trigger("open.mm");
            });
        });
    };

It works at load page, but when i resize the browser it doesnt work, for example i have to put the browser size at some smaller than 1024px, and then when i make it bigger it doesnt stop the plugin and when im at bigger than 1024px then it loads the menu plugin for bigger screens, but when i resize the browser it still working, since the bigger screen plugin has not a fire function and works automatically.

Is there a way to unload the plugins at window resize but not while resize, just when resizing it's finished (for bigger screen's menu plugin a way to dont load it in smaller screens)?

Answer 1

you should use

$( window ).resize(function() {
  //your code here
});

Full documentation