时间戳

首页 > 解决方案 > 滚动部分时用于自定义转换的任何 fullpagejs 代码？

javascript - 滚动部分时用于自定义转换的任何 fullpagejs 代码？

问题描述

“我正在使用 fullpagejs 开发一个整页网站。一切正常，但我想自定义滚动转换，就像这个网站滚动转换一样。https: //www.hellomonday.com/ ”

当您注意到 hellomonday 滚动动画时，原点部分将缓慢滑动，而下一部分将快速滑动。如何实现自定义转换？我已经在 fullpagejs 选项“easingcss3”中有提示，但仍然无法实现我的目标。

$(document).ready(function(){
    $('#bloop-fullpage').fullpage({
        navigation: false,
        slidesNavigation: false,
        loopHorizontal: false,
        scrollingSpeed: 800,
        scrollBar: false,
        autoScrolling: true,
        easingcss3: 'cubic-bezier(0.645, 0.045, 0.355, 1.000)',
    });
});

标签： javascriptjquerycsstransitionfullpage.js

解决方案

您可以查看fullpage.js 的 Parallax 扩展。

在那里你会看到完全相同的“覆盖”概念。也许动画不完全一样，但我很确定可以通过自定义easingcss3fullPage.js的选项来实现，默认为easingcss3: 'ease'

推荐阅读