O'Reilly logo

Mastering jQuery UI by Vijay Joshi

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

Designing the page

For the basic markup we will split the page in two parts. The left-hand side will have placeholders for album names and some help text for users. The right-hand side will have a placeholder div to display album pictures.

After these two partitions, there will be markup for dialog boxes to edit, delete, and zoom in to an image.

Creating placeholders for albums and pictures

Since the album names and pictures will be displayed in the page using JavaScript, we only need to specify placeholder divs for these. The following HTML markup for the index.html file will be used to divide the page in two parts and create the required elements:

<html> <head> <meta charset="utf-8"> <title>Photo Album Manager</title> <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.10.4.custom.min.css"> ...

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