如何在滚动事件发生之前为元素设置动画?

时间:2017-02-22 00:12:22

标签: javascript jquery css animation fullpage.js

需要一些 Fullpage.js 的帮助,但这个问题也可以更普遍地看到。

如何在滚动事件发生之前插入动画?如果你有一个没有 Fullpage.js 的解决方案,也欢迎你。我读到了关于在某处完全阻止滚动/点击事件并且属性自己的函数和方法,但这不是我要搜索的内容,因为我无法从 Fullpage.js 脚本重写任何事件。只想将动画粘贴在滚动输入和实际滚动之间。

实际例子:我滚动,元素淡出,然后页面滚动到下一部分。

实例:http://www.basicagency.com/yir/

提前致谢。

1 个答案:

答案 0 :(得分:2)

我相信您正在寻找onLeave回调。

  

一旦用户离开某个部分,在转换到新部分时会触发此回调。返回false将取消移动。



$('#fullpage').fullpage({
  onLeave: function(index, nextIndex, direction){
    alert('onLeave fired');
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="http://alvarotrigo.com/fullPage/jquery.fullPage.min.js"></script>
<div id="fullpage">
  <div class="section">section</div>
  <div class="section">section</div>
  <div class="section">section</div>
  <div class="section">section</div>
</div>
&#13;
&#13;
&#13;