Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Adobe Dreamweaver

  • Print
  • + Share This
Like this article? We recommend Additional Options

Additional Options

Do you need more than three expandable blocks on your home page? If so, copy-and-paste the code for one block, and change the code for one of the <div data-role="collapsible"> blocks of HTML. (And then, of course, customize the content of your copied block.)

To change the default setting for a block from expanded to collapsed, edit the collapsible code to look like this:

<div data-role="collapsible" data-collapsed="true"> </div>

To make the default state expanded, edit the code for a collapsible block to read as follows:

<div data-role="collapsible" data-collapsed="false"> </div>

Finally, you can apply one of the data-themes that format jQuery Mobile objects by adding data-theme="a", replacing "a" with "b" or "c" or "d" or "e" as desired to choose one of the other data-themes (see Figure 9).

Figure 9 jQuery Mobile data-theme applied.

  • + Share This
  • 🔖 Save To Your Account