Timelines are very popular components among websites. They allow us to track the time of various activities. We are going to create a different kind of timeline with impress.js effects to show the important activities of your career. Working knowledge of 3D space is required to create the timeline. We will be using the depth of the presentation canvas using the data-z attribute. Let's take a look at the preview of our timeline:
You can see that all the events of 2012 are displayed with the same size, and the events of 2011 seem to be smaller compared to the 2012 events. Actually, the 2011 events are created with the same dimensions as the 2012 events, but they are placed deeper in the presentation canvas using the data-z attribute.
So, the events of the current year are displayed initially. Past years are placed deeper and deeper into the canvas. This effect enables us to view the latest event closest to us and go into the screen for the previous events. Hence the...
