O'Reilly logo

HTML5 iPhone Web Application Development by Alvin Crespo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a responsive photo gallery

We'll get a better understanding of touch and gesture events if we focus on small pieces of functionality that we have already seen in traditional mobile applications, such as an interactive slideshow. We've seen this everywhere, a slideshow with next and previous buttons but also the ability to swipe from left to right or vice versa. The buttons are easy, and attaching touch events is also fairly simple; however, swiping does not come out of the box in mobile Safari, so we need to build that. So let's get started by first laying out our gallery and then styling it.

Gallery markup and styling

As with any slideshow gallery, it's essential that we create a good structure. This structure should be easy to follow ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required