CODEWITHSUNDEEP
jqueryjquery-masonry
yennefer
yennefer

Reputation: 189

How to turn off jquery plugin

Not sure if I asked the question right, but what I want to achieve is: I am using masonry plugin on responsive website, and I want it only to work for desktop. So I'm using this code to run the plugin:

var $container = $('#container');
$container.masonry({
        columnWidth: 200,
        itemSelector: '.item'
});

For screens smaller than 900px (on resize and load) I don't want this plugin to work. I have this code, but not sure what I should put inside to stop the plugin from running, if possible? (I'm detecting by css rather than window width)

$(window).on("load resize", function() {
    if ($("#logo").css("left") == "none" ){
      //stop plugin from running
    }
});

Upvotes: 1

Views: 862

Answers (3)

Praveen Shakkarval
Praveen Shakkarval

Reputation: 56

You can use 

if($(window).width()<900){
    $('#masonry').masonry( 'destroy' );
}

and you can reinitialize your script using your initialize function which you used to start your function

Upvotes: 1

mattfetz
mattfetz

Reputation: 425

http://desandro.github.io/masonry/docs/methods.html#destroy

$('#container').masonry( 'destroy' );

Upvotes: 1

Timotheus0106
Timotheus0106

Reputation: 1586

you can check the width of the window by:

var ww = $(window).width();

if (ww <= 900px) {
    $('#container').masonry( 'destroy' );
}

i would suggest that you also use a debounce function in your resize function so it doesn't listen all the time.

greetings timotheus

Upvotes: 0

Related Questions