For further actions, you may consider blocking this person and/or reporting abuse
Read next
What is Next JS and Why Should You Use it in 2024?
JB Hofman -
React vs Vue: A Comprehensive Comparison 🚀
Dharmendra Kumar -
Harnessing Next.js and Firebase: Dynamic Static Path Generation for SSG
Antoine -
API Security in a DevOps Environment: Building a Secure Pipeline for Modern Applications
Syncloop -
Top comments (2)
It seems it starts by a container with N children each one covering the same width and containing an image. You can achieve this part by many ways, for instance, using CSS Grid.
For the hover state in each slide it's just setting the width of the hovered element to a fixed width and scaling a bit the image. This can be done by using CSS transforms and transitions.
You will need extra help for getting the gooey distortion when approaching the slide's bounds. WebGL or jQuery could do that.
Check this pen for the distortion:
codepen.io/waaark/pen/ENRvvq
thanks @eneasmarin
without canvas its possible or not..?