Before diving into the process of building a jQuery Mobilebased page in Dreamweaver CS5.5 that relies on collapsible panels, let me briefly note other jQuery mobile tools that are beyond the scope of this particular article, and less central to the process of building pages, but valuable nonetheless.
Among these other jQuery Mobile tools, two stand out: layout grids and form fields. Let's look briefly at both.
You can design with layout grids that work like tables or use div tagbased CSS columns to divide content into columns. True, columns have a greatly reduced role in mobile page design, but there is a time and place for them, and Dreamweaver CS5.5 provides a rather creative approach to generating layout grid code (see Figure 2).
Figure 2 A mobile page with layout grids.
Input form fields have been customized for mobile devices to make filling out forms on a mobile device easier and more inviting. Dreamweaver CS5.5 includes options for creating mobile-friendly forms with fields like sliders and toggle switches (see Figure 3).
Figure 3 Adding mobile-friendly form fields.