Implementing interactivity in epub for iBooks (English version of ‘Interactivity, that is the question’)

Following an example on the blog of Liza Daly, JavaScript and interactivity in iBooks, I realized that iBooks supports JavaScript-based interactivity in epub content. Liza’s article refers also to Nicholas Gallaguer’s blog, and the article Pure CSS speech bubbles
I am implementing some interactive features to my books in epub format, which I find very interesting indeed. Here are some of them taking as an example some pages of the book La Dama Boba, by Lope de Vega (see post). In this example, I added some JavaScript-based event handlers.
First, I give priority to the digitized text, as one would expect. Now images of the manuscript only appear as a pop-up when you click on the ‘Manuscrito’ box located at the top of the screen.

If you tap on the hyperlinked word ‘Manuscrito’, an image of the page will fade in as a popup. Tap on the image again to dismiss it and return to the original text.

If instead of tapping on the image, you double-click, the image is shown in full screen. With a new double-click, it returns back to text. 

Second, in the same way as explained above, this system of pop-ups can incorporate references to footer, notes, definitions of uncommon words, references to places, references to historical people, and so on. If you tap on the hyperlinked words in the text, an annotation will fade in as a popup. Tap on the annotation again to dismiss it and return to the original text.

I think this example opens up a world of possibilities for implementing interactivity to enhanced ebooks.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.