resize関数の更新を正しく実行する方法がわかりません

Question

このスクリプトの下部にあるif else文で、ウィンドウの幅に基づいてリフレッシュとサイズ変更に基づいて更新できるresize関数を追加しようとしています。ヒーローの下向き矢印ボタンをクリックした場合を除き、すべてが正しく機能しています。オフセットのトップ値はサイズ変更時に更新されません。代わりに

現在のスクリプト - これはそれを破るために縫い目 - 私が試した

$(function() { 
    var windowW = $(window).width(); 
    $('a[href*="#"]:not([href="#"])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if ((target.length) && (windowW > 770)) { 
     $('html, body').animate({ 
      scrollTop: (target.offset().top) + 2 
     }, 450); 
     return false; 
     } else { 
      $('html, body').animate({ 
      scrollTop: (target.offset().top) - 86 
      }, 450); 
      return false; 
     } 
    } 
    }); 
}); 

物事。

$(window).resize(function(e) { 
    var windowW = $(window).width(); 
    $('a[href*="#"]:not([href="#"])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if ((target.length) && (windowW > 770)) { 
     $('html, body').animate({ 
      scrollTop: (target.offset().top) + 2 
     }, 450); 
     return false; 
     } else { 
      $('html, body').animate({ 
      scrollTop: (target.offset().top) - 86 
      }, 450); 
      return false; 
     } 
    } 
    }); 
}); 

DEVのLINK http://www.alexcoven.com/dev/element

Answer 1

これが私のために

$(function() { 
    var windowW = $(window).width(); 
    $(window).resize(function(){ 
    windowW = $(window).width(); 
    }); 
    $('a[href*="#"]:not([href="#"])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if ((target.length) && (windowW > 770)) { 
     $('html, body').animate({ 
      scrollTop: (target.offset().top) + 2 
     }, 450); 
     return false; 
     } else { 
      $('html, body').animate({ 
      scrollTop: (target.offset().top) - 86 
      }, 450); 
      return false; 
     } 
    } 
    }); 
}); 

を働いたスクリプトです@ Sam0のおかげで、私は追加するために必要なすべてのサイズ変更にwindowW変数を更新機能でした！

Answer 2

は、あなただけのサイズ変更にwindowW変数の更新を試すことができます。次のパターンでは、新しいクリックごとに'a[href*="#"]:not([href="#"])'も再評価されます。失敗した場合のコメントによるフィードバック

$(function() { 
    var windowW = $(window).width(); 
    $(window).resize(function(){ 
    windowW = $(window).width(); 
    }); 
    $('body').on('click', function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if ((target.length) && (windowW > 770)) { 
     $('html, body').animate({ 
      scrollTop: (target.offset().top) + 2 
     }, 450); 
     return false; 
     } else { 
      $('html, body').animate({ 
      scrollTop: (target.offset().top) - 86 
      }, 450); 
      return false; 
     } 
    } 
    },'a[href*="#"]:not([href="#"])'); 
});