Also, check out our other similar posts about:
- Best CSS Animation Generators: https://toolonomy.com/css-animation-generators/
- Best CSS Design Generators: https://toolonomy.com/css-design-generators/
Animate on scroll library to reveal animations when you scroll, it allows you to animate elements as you scroll up and down. If you scroll back to the top then the elements will animate to their prior state and are ready to animate again if you scroll down.
barba.js is a small (4.4kb minified and gzipped), flexible, and dependency-free library that helps you create fluid and smooth transitions between your website's pages. It helps to reduce the delay between your pages, minimizing browser HTTP requests, and enhance your user's web experience.
Chocolat.js enables you to display one or several images while staying on the same page. The choice is left to the user to group a series of pictures as a link or let them appear as thumbnails. The viewer may appear full-page or in a block.
Lightbox is free to use in both commercial and non-commercial work but the Attribution is required which means you must leave the developer's name, the homepage link, and the license info intact. None of these items have to be user-facing and can remain within the code.
Locomotive Scroll is a simple scroll library that provides detection of elements in the viewport and smooth scrolling with parallax. A scroll library used by developers at Locomotive.
Built as a layer on top of ayamflow's virtual scroll, it provides smooth scrolling with support for parallax effects, toggling classes, and triggering event listeners when elements are in the viewport.
The library provides built-in components to start animating from scratch like HTML, shape, swirl, burst, and stagger but also brings you tools to help craft your animation most naturally.
Using mo.js on your site will enhance the user experience, enrich your content visually and create delightful animations precisely.
Touch-enabled jQuery plugin that lets you create a beautiful responsive carousel slider. Owl Carousel has been chosen as the number one jQuery plugin by hundreds of developers.
It contains features including fully customizable, touch and drags support, fully responsive, modern browsers as well as zombie browsers support, modules, and plugins.
simpleParallax.js is a very simple and tiny Vanilla JS library that adds parallax animations to any image.
Where it may be laborious to get results through other plugins, simpleParallax.js stands out for its ease and its visual rendering. The parallax effect is directly applied to image tags, there is no need to use background images.
Slick is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping, and much more!
It has features including fully responsive to scales with its container, separate settings per breakpoint, uses CSS3 when available, and fully functional when not, swipe enabled or disabled if you prefer, desktop mouse dragging, infinite looping, fully accessible with arrow key navigation, add, remove, filter & un-filter slides, autoplay, dots, arrows, callbacks, etc...
It is a simple slider meeting various demands, even thumbnails, nested sliders o vertical directions inspired by slick, Swiper, and Glide.
Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps.
It is not compatible with all platforms, it is a modern touch slider that is focused only on modern apps/platforms to bring the best experience and simplicity.
Swiper, along with other great components, is a part of Framework7 - a fully-featured framework for building iOS & Android apps. Swiper is also a default slider component in the Ionic Framework.
The project aims to create an easy-to-use, lightweight, cross-browser, general-purpose 3D library. The current build only includes a WebGL renderer but WebGPU (experimental), SVG and CSS3D renderers are also available in the examples.
Tilt.js is a tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery. It is a lightweight jQuery library that allows you to create simple tilt effects on hover without taking much load time.
tsParticles is a lightweight library for creating particles, an improved version of the abandoned and obsolete particles.js. A TypeScript library for creating particles that is dependency-free, browser-ready, and compatible with React, Vue, Angular, Svelte, jQuery, Preact, and Inferno.
Velocity is an animation engine with the same API as jQuery's $.animate(). It works with and without jQuery. It's incredibly fast, and it features color animation, transforms, loops, easings, SVG support, and scrolling. It is the best of jQuery and CSS transitions combined.
Reveal Animations When You Scroll. Very Animate.css Friend Easily customize animation settings: style, delay, length, offset, iterations… 100% MIT Licensed, not GPL. Keep your code yours. ES2015+, naturally Caffeine free.
I believe you found this resource list helpful so I would ask you for a favor, please spread the word and share it with your friends, colleagues, and community to make them aware of this awesome resource list.
Also if you want to ASK or SAY something about this topic then feel free to share your thoughts in the comment box below and add some extra value for the readers and the community.
Thanks for visiting Toolonomy.com!