Check this project on Dribbble.
The bouncing carousel is an experiment with SVG animations technology. Inspired by Carousel.
Animation, used in the carousel is based on Animation SMIL specification. All the SVG elements can be stylized using CSS, you can also create animations with CSS, but there are such properties in SVG that greatly enhance its capabilities. For example, the path attribute has a data set that defines the object's path, and this data can not be changed through CSS.
In the councing carousel <animate> tag is used, which allows
to animate SVG without using a cumbersome JS-code, but only by
:hover pseudoclass on the carousel element.
Visually, the desktop version creates an effect similar to the "pocket".
For the gallery images png, gif formats are preferred thus formats supporting
transparency - this will allow the objects in it to look as effective as possible.
Carousel is ideal for the e-commerce focused websites.
https://agilie.github.io/Bouncing-Carousel/
Problems? Check the Issues block to find the solution or create an new issue that we will fix asap. Feel free to contribute.
This mini-project is open-sourced by Agilie Team info@agilie.com
If you have any questions, suggestions or just need a help with web or mobile development, please email us at web@agilie.com. You can ask us anything from basic to complex questions.
We will continue publishing new open-source projects. Stay with us, more updates will follow!
The MIT License (MIT) Copyright © 2017 Agilie Team