O'Reilly logo

jQuery Mobile Cookbook by Chetan K Jain

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

Using a split button list

A split button list is a list that provides two different actions for the same list item. This is created by adding two anchor links to a list item. The framework then automatically converts the list item to a split button. Any image added to the first link gets scaled down to a thumbnail with a size of 80 x 80px. The second link is replaced with an icon called the split icon and is positioned at the right-hand side corner of the split button. This recipe shows you how to create a split button list to display images in a list.

Getting ready

Copy the full code of this recipe from the code/06/split-button-list sources folder. This code can be launched using the URL http://localhost:8080/06/split-button-list/main.html.

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