siropo
siropo

Reputation: 210

Unload jquery function if window resize

I try to unload function if browser window less than 944px. I start to write this

$(window).resize(function() {
            if ($(window).width() >= '944') {
                        $(window).load(function() {
                            $('#slider').nivoSlider();
                        });
                    } else {
                        alert($(window).width());
                        if ($(window).width() <= '944') {
                        $(window).unload(function() {
                            $('#slider').nivoSlider();
                        });
                    }
            }
            });

but i stuck. I want if the user enters, verify resolution and if more than 944px to load jquery function, however if browser is resize or less resolution than 944px, function will be unload.

Upvotes: 0

Views: 4963

Answers (1)

Barlas Apaydin
Barlas Apaydin

Reputation: 7315

i have a different solution for your problem; you can prepare a new slider mask (just like slider but without nivoSlider functions) for <944px window width, when browser width <944px niveSlider will be hide and your mask will be seen.

check it out:

$(window).resize(function() {
    windowWidth = $(this).width();//you need to use this for changable values
    if ( windowWidth > 943) {

       $('#sliderMask').hide();
       $('#slider').show();
       $(window).load(function() {
         $('#slider').nivoSlider();
       });

    } else if ( windowWidth < 944) {

       $('#slider').hide();// hide your nivoSlider
       $('#sliderMask').show();// show your basic slider mask

    }
});

please note that: you need to use $(this) to get current value.

here is jsfiddle example for you; check the console log from your browser's developer panel

Upvotes: 3

Related Questions