How to create an image slider / slide show without programming – Part II

Written by on October 19, 2012 in CSS, Javascript, Web development - 1 Comment
FruitSalad

In Part I of this tutorial, I showed how to add images and text and how to animate them. I also showed how to use web fonts to make the animated text more interesting.

In this tutorial I am going to show how we can loop the animation by adding triggers on the timeline. Check the final result.

In the next video I will cover how to add interactivity to the slider, so the user can navigate from slide to slide manually.

[UPDATE]
Check Part 3 here

How to create a web site slider without programming – Part I

Written by on October 17, 2012 in CSS, Javascript, Web development - 1 Comment
snapshot

I have seen in some forums that people struggle using  jQuery plugins or Flash-based sliders. So, I decided to make a series of video tutorials to show how to make sliders with cool animations and custom user interactivity using a free application. The program is Adobe Edge Animate, which Adobe launched a few days ago and decided to offer it for free. Hence, anyone can download and use it to make sliders, websites and more.

In this video, part I, I show how to add images and text and add nice animations / transitions. In the next one (coming soon) I will show how to add user interaction elements, so the viewer can move forward and backwards.

Edge Animate content works on mobile devices running iOS and Android™ operating systems, as well as on modern desktop browsers.

Let me know if there is something in particular that you would like me to add in a future video.

[UPDATE]
Check part 2 here
Check Part 3 here

UA-4365634-1