Issue with Superfish Destroy function

Issue with Superfish Destroy function

I am trying to have the Superfish function destroy itself on screens less than 600px. I think I have the solution but it only works on Firefox, the other browsers I have tried it on (chrome, safari, and opera), the superfish does not get destroyed.

The site I am developing is currently on a local dev environment so I cannot link to the site but here is the code I am using. Also, it is built on Wordpress.

my superfish.min.js file is version 1.7.4 and my function is as follows

  2. /* 
  3.  * Custom Responsive Superfish settings
  4.  */

  6. jQuery(document).ready(function($){
  7.     var breakpoint = 600;
  8.     var sf = $('ul.nav-menu');
  10.     if($(document).width() >= breakpoint){
  11.         sf.superfish({
  12.             delay: 200,
  13.             speed: 'fast'
  14.         });
  15.     }
  17.     $(window).resize(function(){
  18.         if($(document).width() >= breakpoint & !sf.hasClass('sf-js-enabled')){
  19.             sf.superfish({
  20.                 delay: 200,
  21.                 speed: 'fast'
  22.             });
  23.         } else if($(document).width() < breakpoint) {
  24.             sf.superfish('destroy');
  25.         }
  26.     });
  27. });              


Any ideas on why its working in Firefox but not Chrome, Safari, or Opera?