Animation on canvas/js?

Question

Web development

The bottom line is that the client came, he said he wants to animate interchangeable pictures like on the first screen https://travelshift.com/ , after looking at what and how and by googling I realized that this is done using WebGL, shaders and the three.js library. After I said that, I heard these words. - 'This can be done by combining a couple of simple css animations and all these js and blah blah are not needed', to the question - why did you get this answer 'Said the head of the development department. This is just a combination of animations consisting of 3 simple animations, you just need to combine them. We already had similar projects, but now all the developers are on other projects, and now I wanted to know - am I so slow-witted that I don’t know how to do it on css, or is there a css pro sitting there?

Answer 1

You can't do this with CSS - there is uneven image stretching. Here the "head of the development department" either does not rummage around in the frontend, or tries to bring down the price. But the thing is from the category of "yabzaverstal", and I'm just collecting a collection of examples with shaders , so I sketched a similar effect for it, only without a blot in the center (there is a bit of extra code, but this is an overhead so that the series of examples does not differ much) .

* If you suddenly copy yourself, do not forget about the license.

Answer 2

Yes, of course, it's easy to do on css, I even think two animations will be enough, it's just that you are not competent.
Ps if that is sarcasm;) what css?

Answer 3

/offtop
awesome effect
(make it on css - show me how)