make my menu stay at the top of the browser except on mobile devices (i.e #header below 400px)

make my menu stay at the top of the browser except on mobile devices (i.e #header below 400px)

Using http://stickyjs.com/

I am trying to make my menu stay at the top of the browser except on mobile devices (i.e #header below 400px), this is my code which isn't throwing up any errors when i check is JSHint, but at the same time isn't working

  1. $(document).ready(function () { 
  2.     if ($('#header').width() > 400) { 
  3.         $("#menu").sticky({ topSpacing: 0 }); 
  4.  } 
  5. }); 
  6. $(document).ready(main);

Could really use some help if anyone has an idea?