Website frame system

[radutrs 1 Likes (Newbie)]

Hi,

 

i would like to create a website with a frame system like this https://cuberto.com/

 

I like a lot the animation, can you give me a hint, how can i create a website similar to the example above? Thanks!

[Sahil 2,657 Likes (Superhero)]

Hard to tell how you can build entire website, following are some of the threads with similar ideas or animation. It is just a lot of tiny steps and then putting them all together.

 

 

 

 

 

[radutrs 1 Likes (Newbie)]

Thank you Sahil,

 

regarding https://cuberto.com/ im only interested in that swipe effect, when you scroll the banner comes from left and then stop when it reaches its half. Thats what i want to create. Thanks!

[Sahil 2,657 Likes (Superhero)]

Here is simple example. Trick is to animate scaleX so element looks like it transitions out and new element comes from left and changing transform origin of your element. Also animating scale instead of width gives you far better performance.

 

See the Pen ELwZOb?editors=0010 by Sahil89 (@Sahil89) on CodePen