HTML5 Slideshow Manual

Create Mind-Blowing HTML5 Presentations!

In this article you'll find a detailed manual about the HTML5 Slideshow extension. It helps you bring your photos to life with amazing effects from the famous director, Ken Burns. The HTML5 slideshow slowly zooms in and pans across your photos and uses HTML5 elements like the Canvas control when available for the highest animation quality and no flash at all – so it runs on all iDevices smoothly!


Advanced: Using custom controls to navigate the HTML5 Slideshow 

In this tutorial we will show you how you can use custom controls in order to navigate the HTML5 Slideshow

*You can also check out the video.


How to do it

  1. We've created a slideshow containing six images and 6 custom "buttons", which we are going to use in order to control the slideshow


  1. Select the first custom "button" (1) and click the Tag Inspector button (2).




  1. Click the Behaviors button (1) and click the Add Behavior button (2). From the menu we choose the DMXzone menu item (3) and then the Control HTML5 Slideshow menu item (4).


  1. The Control HTML5 Slideshow dialog opens. Now we are going to select Go to Slide item (1) and enter 0 for the first slide, 1 for the second etc (2).  


  1. We follow the same steps for the other custom "buttons".  After you're done you can save your workd and preview it in the browser.




Lubov Cholakova

Lubov CholakovaLubov has been with DMXzone for 8 years now, contributing to the Content and Sales departments. She is bringing high quality content in the form of daily blog updates, reviews, tutorials, news, newsletters,update emails and extensions' manuals. If you have a product that needs publicity or any other questions about the entire DMXzone community, she is the one you can contact.

See All Postings From Lubov Cholakova >>

Comments

Be the first to write a comment

You must me logged in to write a comment.