While doing some research for another project I found the website of web design agency Cuberto. I really liked their animated website and wondered how they went about building it.
I started playing around with my favourite slider plug in, Swiper, using the change in slide (and built-in amending of element classes) to trigger CSS animations.
So with the addition of some more javascript, I got something that works quite well. It is still a bit experimental, I have controlled the size of the window for desktops, and only really tested it on my iPhone 6S.
I learnt a lot working on this though:
- Digging into the Swiper API
- Custom Javascript functions to help control the navigation
- Inline SVG’s and CSS
- CSS Transitions
Now I want to dig around into some javascript animation libraries to see how much easier I could have made things for myself