.matchMedia()を使ってハンバーガーメニューを作成する

window.matchMedia

window.matchMediaというメソッド使用することでCSS側に記述するブレイクポイントの記述と同じような形でJS側の判定条件を記述する事ができます。

例　1000pxまではjsを有効にさせる

$(window).on('load resize', function(){
if(window.matchMedia('(max-width:1000px)').matches) {

1000px以下で有効にさせたいjquery

}else{
1001px以上で有効にさせたいjquery

});

ナビゲーションを作成

Toggleを使う場合、「:not(:animated)」を設定しないとボタンをクリックした回数分スライドしてしまうので、「:not(:animated)」の設定をしましょう。
またスマホのの場合、resizeイベントの解釈がiOSとandroidで微妙に違うので注意が必要です。

$(function(){
var windowWidth = $(window).width();

$(window).on('load resize',function(){

var ww = $(window).width();
if(windowWidth != ww) {
if(window.matchMedia('(max-width:767px)').matches){
//スマホの時
  $('nav').hide();
  $('#ham-btn').removeClass('click');
}else{
	$('nav').show();
};
 windowWidth = ww;
        }
});
   $('#ham-btn').on('click',function(){
   $(this).toggleClass('click');
   $('nav:not(:animated)').slideToggle(100);
  });
});

ユーザーエージェントでスマホかPCか判別してやる方法もあります

ユーザーエージェント

ユーザーエージェント（UserAgent）とはウェブサイトに訪問する際「Google Chromeからアクセスしています」「iPhoneからアクセスしています」などのどんな環境でアクセスしているのかの利用者の情報のことを言います。
ウェブサイトにアクセスする際にはこのユーザーエージェントを必ず送ることになっています。

今回のパターンはPC・タブレットであればjQueryを有効に。スマホ（iPhone・Android）であればjQueryを無効にします。
「!」エクスクラメーションマーク (exclamation mark)とは、Javascriptでは否定の意味で使われます。

if(!navigator.userAgent.match(/(iPhone|Android)/)){
$(function(){
//ここにjQueryの記述
});
}

逆にPC・タブレットであればjQueryを無効に。スマホ（iPhone・Android）であればjQueryを有効の場合

if(navigator.userAgent.match(/(iPhone|Android)/)){
$(function(){
//ここにjQueryの記述
});
}

また、PCであればjQueryを無効に。スマホ（iPhone・Android）とタブレット（iPad）であればjQueryを有効の場合

if(navigator.userAgent.match(/(iPhone|iPad|Android)/)){
$(function(){
//ここにjQueryの記述
});
}

このように「|」で区切って自身でユーザーエージェントを追加する事も出来ます。