How to make such an animation on the site?

Question

css

Hello, tell me a simple and lightweight js library that will produce different animations on the site.
For example, there is an img on the site so that it moves smoothly on the page on its own, then so that the text appears when scrolling smoothly from different sides. And also to have cool animations with buttons, for example, also to have 3D animation on the site so that the cube spins. And the logo was spinning. Well, you understand.

Here is a site in which I want to make the same animations:
andrikanich.guru/freelance/2017/hranipex
https://tortishnaya.ru/

And 3d like here for example: https://total-pr.net/

Answer 1

A set of tools is always a discussion from the category "felt-tip pens are different in taste and color." I would first look at:

• For scrolling - Locomotive Scroll .
  
• For everything - Anime.js .
  
• For smooth transitions between pages - Barba.js .
  
• For 3D - Three.js .
  

But here it is important to understand that we have a lot of similar tools, and in the end it is not so important what you take. You can do many things (almost everything, in fact) with your own hands from scratch - you will get narrowly focused, but very small and smart solutions. It may seem strange, but really complex tasks that require complex tools and a lot of code are rare in this area, because. everything more or less complex in computer graphics requires serious computing power and does not work well on phones and laptops with integrated graphics. A bright future has come only for web evangelists, and in our market there is still a gray present. Sometimes there are algorithmically complex concepts where you need to rummage a little in physics and mathematics, but there will be no ready-made libraries. And within the framework of common tasks, ideas, designs,

Answer 2

gsap + ScrollTrigger navksidku example - link

Answer 3

Nice libraries, might come in handy.
https://github.com/bendc/animateplus
https://animejs.com/