Question

I am using the Jquery plugin isotope. Depending on the screen resolution I need to destroy the isotope widget to prevent it from running its function. I am using the following code:

$(window).smartresize(function(){
            if($(window).width() < 700) {
                container.isotope('destroy');

            }else {
                container.isotope({$options});
            }
        });

This works fine on the first resize, the isotope widget is destroyed. However, if I resize again (below 700px) the following exception is thrown:

cannot call methods on isotope prior to initialization; attempted to call method 'destroy'

How can I check to see if container.isotope exists before running container.isotope('destroy');?

Complete Working Code

      $(window).load(function(){
        var container = $('{$this->selector}')
        if($(window).width() > 701){
            container.isotope({$options});
        }else{
            container.isotope = false;
        }

        $(window).smartresize(function(){
          if($(window).width() < 700) {
            container.find('.item').removeAttr('style');
            if(container.isotope) {
              container.isotope('destroy')
              container.isotope = false
            }
          } else{
            container = $('{$this->selector}')
            container.isotope({$options})
          }
        });
      });

Answer 1

$(window).smartresize(function(){
  if($(window).width() < 700) {
    if(container.isotope) {
      container.isotope('destroy')
      container.isotope = false
    }
  } else if(container.isotope) {
    container.isotope({$options})
  }
})