不确定如何正确执行调整大小功能更新答案

【问题标题】：Not sure how to properly execute resize function update不确定如何正确执行调整大小功能更新
【发布时间】：2017-04-30 18:14:22
【问题描述】：

尝试为此添加一个调整大小函数，以允许此脚本底部的 if else 语句根据窗口宽度进行更新，同时刷新和调整大小。一切正常，除了点击英雄上的向下箭头按钮时，偏移顶部值不会在调整大小时更新。

当前脚本到位 -

$(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;
      }
    }
  });
});

开发者链接 http://www.alexcoven.com/dev/element

【问题讨论】：

是否需要刷新整个脚本？看起来像 windowW 变量应该做的？
是的，只是 winowW 变量

标签： jquery css function scroll resize

【解决方案1】：

您可以尝试在调整大小时更新windowW 变量吗？以下变体还会在每次新点击时重新评估'a[href*="#"]:not([href="#"])'。如果不成功通过 cmets 反馈？

$(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="#"])');
});

【讨论】：

非常感谢老兄！我使用了脚本的顶部。底部禁用平滑滚动。

【解决方案2】：

感谢@Sam0，这是对我有用的脚本

$(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;
      }
    }
  });
});

我只需要添加一个在调整大小时更新 windowW 变量的函数！

【讨论】：