Question

我试图在fullPage.js应用上切换部分时触发两个CSS事件。请看一下我目前在这里的小提琴： http://jsfiddle.net/pingo_/67oe1jvn/2/

我想做以下两件事：

当我离开页面时，将fa-stack图标的类更改为悬停下的属性（当前颜色仅在点击/悬停时更改，但如果使用仅滚动，我希望它更改）
当背景颜色为＃004e7b（目前无法看到第2和第4部分中的节点）时，将导航节点的颜色更改为#ffffff

实现这一目标的最佳方法是什么？我在javascript breakout的底部有一些代码，当我离开第一部分时，它试图触发一条消息。这实际上完全扰乱了滚动并一直跳到最后一部分：

var fromSection1 = false;
$('#fullpage').fullpage({       
  onLeave: function(index, direction){
     var leavingSection = $(this);
    //after leaving section 2
    if(index == 1 && direction =='down'){
      alert("Going to section 2!");
    }else{
      fromSection1 = false;
    }
  }
});

我会做类似的事情来触发fa-nav部分的类更改吗？我没有在CSS中写任何东西，但是我不确定它是应该在那里，在javascript中，还是在两者中完成。我之前没有注入类属性，并且在这两个方面遇到了很多困难。请告知最佳方法，看看您是否能够提供帮助。谢谢!!

Answer 1

您正在使用一年前提供的答案...现在onLeave事件有3个参数，其中有2个，如您所见here in the documentation.

onLeave：function（index，nextIndex，direction）{

关于您的问题，要更改课程，您需要javascript。但也许这不是你所需要的。

查看this video。

请记住，fullPage.js会将类active添加到活动部分，并在body元素中添加类fp-viewing-xxx，其中xxx是anchor的名称如果没有提供锚点，则为当前部分或其索引。

这样你就可以玩css：

#demo{
    color: red;
} 

/* applied only on the section with the anchor `firstpage` */     
body.fp-viewing-firstpage #demo{
    color: blue;
}

fullPage.js onLeave事件触发器

1 个答案: