-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating
jQuery UI Cookbook
By :
The tabs widget knows how to populate a given tab panel with remote content out of the box. It's all about how we specify the tab links. For example, an href attribute that points to #tab-content-home will load the content using the HTML found in that element. But, if instead of pointing to an already-existing element we point to another page, the tabs widget will load the content into the appropriate panel on demand.
This works as expected without passing options to the tabs, but there is the beforeLoad option should we want to tweak the behavior of the Ajax request in an any way. Let's take a look at some of the ways we can work with remote content using the tabs widget.
First, we'll create the HTML for our tabs widget, which consists of four links. The first three point to existing resources while the fourth doesn't exist, and so the Ajax request will fail.
<div id="tabs">
<ul>
<li><a href="ajax/tab1.html">...
Change the font size
Change margin width
Change background colour