HTML Slidy on smart phones and tablets

Slidy is a free web application for slide presentations, and makes use of a simple HTML microformat for slides. Until recently, Slidy was difficult or impossible to use on keyboard-less touch screen devices like the iPhone or Android phones. I am pleased to announce that Slidy can now be used on these devices with touch gestures:

  • swipe rightleft to go to next page or reveal next item
  • swipe leftright to do the reverse
  • swipe up or down to show/hide the table of contents

You have to swipe reasonably quickly. If you want to scroll the viewport, drag your finger slowly across the screen in the direction you want to scroll. Of course, this all depends on how much content people cram into their slides. You should be able to use the native pinch/stretch gestures to change the zoom factor. There is further work to do, e.g. on device detection and on expanding the size of the table of contents. However, I very much look forward to your feedback and suggestions for improvements.

7 thoughts on “HTML Slidy on smart phones and tablets

  1. Slide2 is great on Firefox and Chrome. IE and rekonq are unusable. Presumably these are browser problems that you don’t intend to address?

  2. You can indeed link to individual slides. The simplest solution is to view the slide, and then to copy and paste the URL from the browser’s address bar. Here is an example of how to link to slide 9 in the slidy introduction:

    <a href="http://www.w3.org/Talks/Tools/Slidy2/#(9)">slide9</a>

    where the syntax uses the number of the slide. I will take a look at getting the script to also work with slide id’s, but that isn’t supported right now.

  3. Has Slidy perhaps been changed since this post was written? Above, we read

    1. swipe right to go to next page or reveal next item
    2. swipe left to do the reverse

    But for me on an iPad 2, it’s the other way around.

    And it works well. The only niggle is that if a slide has too much content to fit the screen and one scrolls down or pinches the screen to see more, the grey line with “help? contents? slide X/Y” remains where it was relative to the text (rather than staying at the foot of the screen), thereby often ensuring that a single line of text remains obscured and thus illegible. An option to shrink this usually helpful/informative line to a mere blob (and to expand the blob back to the full line) would be helpful.

    A minor oddity is that as I go through a slideshow on the iPad, the URI at the top doesn’t change (I continue to be told that I’m on “#(1)” for the second and subsequent slides). However, this seems to have no effect: a link to (say) #(9) takes me to #(9) (whereupon I’m told I’m at “#(9)”, and after which I continue to be told this).

    Tablet-irrelevant, but the latest version of Opera for Mac OS X as of yesterday doesn’t at all like Slidy when in “presentation view” (its term for full-screen or kiosk mode). If I don’t attempt “presentation view”, it happily handles the slideshow.

  4. I originally got the swipe direction wrong, and soon corrected that. I am now looking for suggestions for how to hide/show the toolbar and table of contents on tablets. Another feature under consideration is to add dynamic classes to allow for different styles for incrementally shown content before, during and after they are revealed.

    Note that I only have a Linux notebook and an Android tablet, so please feel free to send me bug fixes for other operating systems.

    I have restarted work on a cross-browser editor using content editable, HTTP PUT and rolling my own actions/undo/redo to avoid the wide variations across browsers seen with execCommand. Getting this to work effectively on tablets will be an even bigger challenge.

  5. Is Following possible? To use bluetooth or usb(with Camera Connection Kit) keyboard connected to iPad’s cursor keys and space bar to navigate through W3C Slidy web pages?

Comments are closed.