10+最佳Javascript滚动动画插件

滚动动画有助于更好地控制用户流程,并确保将重要内容适当地显示给给定用户。这个想法是,当用户滚动浏览网站时,会触发不同的动画。所以这里有10多个最佳Javascript 滚动动画 用于处理各种动画的插件。

Josh.js

一个JavaScript库,用于对页面滚动中的内容进行动画处理。

Josh.js


tus鼠

tus鼠允许开发人员创建精美的动画来模拟css关键帧,并在用户滚动时应用。

tus鼠


揭示

这是一个滚动显示动画框架,具有无限的动画可能性。显示动画可以与页面中的任何元素一起使用。 揭示通过使用jQuery,GSAP和Animus构建而成,可以确保提供无与伦比的滚动显示动画和设计体验。

 揭示-滚动显示动画jQuery插件


机车卷轴

Locomotive开发人员使用的简单滚动库。构建为ayamflow之上的一层’的virtual-scroll,它提供平滑的滚动,并支持视差效果,切换类以及在元素位于视口中时触发事件侦听器。

机车卷轴


萨尔

以性能为重点的轻量级滚动动画库,使用香草JavaScript编写。没有依赖! 萨尔(滚动动画库)的创建是为了为滚动动画元素提供高性能和轻量级的解决方案。它’基于Intersection Observer的,它在检查元素方面提供了惊人的性能’出现在视口中。

萨尔


松懈.js

松懈.js是一个用于创建动画滚动效果的插件。到目前为止,已有6,160颗星。很简单&轻巧的香草javascript插件可创建流畅的&当您滚动漂亮的动画!利用最直观的交互的力量,使您的网站活跃起来!

松懈


Jump.js

一个现代化的平滑滚动库。 Jump的开发考虑了现代JavaScript工作流程。要使用它’建议您建立一个可以移植ES6并捆绑模块的构建系统。

Jump.js


Rallax.js

Rallax.js是一个香草JS插件,可实现动态视差滚动效果,而无需依赖。

Rallax.js


T型滚动

一个现代化的滚动显示库,其中包含有用的选项和动画。

滚动


搬去

轻量级的滚动动画javascript库,没有任何依赖性。

搬去


滚动触发

根据滚动位置触发html元素上的类。使用requestAnimationFrame而不是’提示用户滚动。

滚动触发


AOS

它允许您在上下滚动时为元素设置动画。如果滚动回到顶部,元素将为其动画’的先前状态,如果向下滚动则可以再次设置动画。

动画滚动


滚动显示

适用于Web和移动浏览器的轻松滚动动画。

滚动显示


甜蜜的滚动

ECMAScript2015友好,无依赖的平滑滚动库。

甜卷


Wow.js

向下滚动页面时显示CSS动画。默认情况下,您可以使用它来触发animate.css动画。但是您可以轻松地将设置更改为您喜欢的动画库。

WOW.js


变形背景形状

一种装饰性网站背景效果,其中SVG会在滚动上变形和变形。

变形背景形状


ScrollMagic

神奇的滚动交互的javascript库。

ScrollMagic


4 Comments

  1. 加文说:

    揭示是一个很棒的插件,尽管它是高级插件,但具有许多精美的动画和功能。

  2. gspa和滚动魔术是最好的一种。

  3. JF说:

    真好!谢谢!

  4. 如果您需要像滚动动画这样的WOW.js,这里是另一个Josh.js: //mamunhpath.github.io/josh.js/

  5. 马丁说:

    对我来说是AOS //michalsnik.github.io/aos/
    简单易用。

发表评论

请客气。我们对此表示赞赏。您的电子邮件地址将不会被发布,并且必填字段已被标记

该网站使用Akismet减少垃圾邮件。 了解如何处理您的评论数据.