javascript - 使用 Fullpage.js 滚动到特定 anchor 时隐藏 div

Question

我计划使用来自 http://alvarotrigo.com/fullPage/ 的出色的 Fullpage.js但想在滚动到特定 anchor 时隐藏特定的 div 或图像。

例如，如果页面从#home 开始，并且有 3 个 anchor (全屏部分)#home、#biog 和 #email，每个部分的顶部都有一个 Logo ，我想要例如来自 # 的 Logo biog 隐藏(可能淡出)但在滚动到下一个 anchor 时重新显示(可能淡入)#email

这可以做到吗？

感谢您的帮助...

Answer 1

正确的方法是使用 fullPage 事件。在这种情况下:afterLoad 或 onLeave Take a look at the documentation有关如何使用它们的更多信息。

您可以看一下这个活生生的例子，其中顶部菜单根据用户是否在第一部分中淡入或淡出: http://jsfiddle.net/J8hqM/8/

它应该是这样的:

  // Script FullPage
  $.fn.fullpage({
      /* whatever config you have...*/
      afterLoad: function(anchor, index){
          if(index == 1){
               $('#menu').fadeOut();
          }else{
               $('#menu').fadeIn();   
          }
      }
  });