Question

我打算使用来自http://alvarotrigo.com/fullPage/的精彩Fullpage.js，但想要在滚动到特定锚点时隐藏特定的div或图像。

例如，如果页面从#home＆amp;有3个锚点（全屏部分）＃home，＃biog＆amp; #email所有在每个部分顶部都有一个徽标我希望例如#biog中的徽标隐藏（可能是淡出）但是当滚动到下一个锚点#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();   
          }
      }
  });

Answer 2

您可以使用jquery的$(window).bind( 'hashchange'函数。

$(window).bind( 'hashchange', function() {
    var winloc = window.location.href;
    if (winloc.substring(1) === "Yourpage") {
    //do something. For example:
    $("#Yourlogo").css('display', 'none');
    }
});

使用Fullpage.js滚动到特定锚点时隐藏div

2 个答案: