Building Wraparound Slideshows

Slideshows on Web sites present the user with an image and let the user control the progression (either forward or backward) of the images. JavaScript gives the user the interactive control needed. Script 4.16 shows the HTML needed, and the JavaScript in Script 4.17 has what you need to add slideshows to your pages.

This script builds a slideshow that wraps around—that is, if you go past the end of the list you go back to the beginning and vice versa. Figure 4.14 shows the new slideshow.

Figure 4.14. Clicking the Previous or Next link calls the processPrevious() or processNext() function, respectively.
Script 4.16. This HTML page creates a slideshow.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

Get JavaScript and Ajax for the Web: Visual QuickStart Guide, Seventh Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.