Web Development with jQuery®

Implementing Tabs (^) ❘ 419

The preceding document is styled with the following style sheet:
body {
font: 12px 'Lucida Grande', Arial, sans-serif;
background: #fff;
color: rgb(50, 50, 50);
}
div#exampleTabFirst {
background: lightblue;
padding: 5px;
}
div#exampleTabSecond {
background: lightgreen;
padding: 5px;
}
div#exampleTabThird {
background: yellow;
padding: 5px;
}
The following script demonstrates a call to the jQuery UI’s tabs() method:
$(document).ready(
function()
{
$('div#exampleTabs').tabs();
}
);
Figure 18-1 shows that the preceding actually doesn’t look like much so far, but some groundwork
had been laid in preparation of creating a proper tabbed user interface.

FIGURE 18-1

http://www.it-ebooks.info