Adobe® Dreamweaver® CS4 Bible

676

Part III

Adding Advanced Design Features

Enhancing Your Site with Spry Widgets

Spry is not limited to data manipulation. Another Spry implementation, called widgets, combines

HTML, JavaScript, and CSS to produce advanced interactive layouts and form controls. Spry layout

widgets bring sophisticated design options—such as pure CSS menus and tabbed panels—to the

Web professional’s palette, whereas Spry form widgets solve one of the Web’s most persistent prob-

lems, form validation, brilliantly.

All Spry widgets share certain common characteristics. First, they are extremely easy to implement:

typically, only a dragged-and-dropped object is required. Second, all widgets rely on a customized

Property inspector to make Design view modifications a snap. Finally, each widget is completely

customizable through associated CSS rules—it’s easy to integrate widgets into the look-and-feel of

any CSS-based site.

Another commonality that Spry widgets share is their representation in Design view: each is con-

tained by a blue border with an identifying tab, as shown in Figure 17-16, much like editable regions

for Dreamweaver templates. To select any widget to modify the values of its Property inspector, click

the blue tab.

FIGURE 17-16

Select a widget’s blue tab to invoke its Property inspector.

As with the Spry Data objects, support files—one for JavaScript and one for CSS for each Spry wid-

get— ...