0

我正在为我正在从事的项目寻求帮助，但我似乎无法弄清楚。我已经搜索并尝试了各种脚本以及没有冲突的脚本。我希望有人可以帮助我。

我有一个从导航锚定到页面内容的页面。当您将鼠标悬停在页面中间的图像上时，您可以单击到非画布页面。我已经完成了这项工作，但是当您单击页面底部的主导航时，我希望平滑滚动。似乎画布外的锚点和平滑滚动脚本不能一起工作。我对 jquery 和 javascript 很陌生，所以我似乎无法让它工作。

我找到了平滑滚动的这段代码（现在我把它注释掉了），但是当我把这段代码放在页面上时，它会破坏导航锚：

$(function() {
$('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) {
      $('html, body').animate({
        scrollTop: target.offset().top
      }, 1000);
      return false;
    }
  }
});
});

是否有其他代码可以在我的页面上运行？你可以在这里查看我的页面：

http://ebresearch1.wpengine.com/index.html

此外，我无法让导航图标处于活动状态。

我正在使用这段代码：

jQuery('.nodes a').click(function () {
jQuery(this).find('.inactive-circle').toggleClass('active hide');
});

但它只切换活动和非活动状态。我希望它们仅在您单击另一个导航项之前保持活动状态。

平板电脑问题：

另一方面，我在导航中的手机/平板电脑汉堡链接在点击后不会关闭导航。它只是保持打开状态。单击链接后，我似乎无法触发关闭画布。

我知道这是很多信息，但我被困住了。如果我需要提供更多信息，请告诉我，我会发布。

谢谢！

4

1 回答 1

0

快速解决您的第二个问题：

jQuery('.nodes a').click(function () {
   jQuery('.nodes a').find('.inactive-circle').removeClass('active hide');
   jQuery(this).find('.inactive-circle').addClass('active hide');
});

不太确定你的 div 和 css 是如何在这里设置的，因为感觉它可能会更简单，但主要原则是首先让你的所有.nodes adiv 处于非活动状态，然后让这个 div 处于活动状态。

对于第三个问题，这有点小技巧，但是为了避免干扰您的 offCanvas 脚本，您可以在单击菜单 div 时触发对汉堡包的单击：

jQuery('#0 a').click(function () {
    jQuery('#rightBurger').trigger('click');
});

希望有帮助，必须跑步，但如果没有其他人这样做，我会回来尝试主要的。

于 2016-09-14T17:41:54.387 回答