O'Reilly logo

jQuery and JavaScript Phrasebook by Brad Dayley

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Using Collapsible Blocks and Sets

<div data-role="collapsible" data-collapsed="false">    <h3>Photo Information</h3>    <p>Single Content.</p> </div> <div data-role="collapsible-set">   <div data-role="collapsible">     <h3>Image 1</h3><img src"1.jpg" /></div>   <div data-role="collapsible" >     <h3> Image 2</h3><img src="2.jpg" /></div>   <div data-role="collapsible">     <h3> Image 3</h3><img src="3.jpg" /></div> </div>

Another useful way to represent content is by dividing it into collapsible elements. A header is presented that the user can see, but the content the header represents is hidden until the header is clicked.

This allows you to show and hide the content in-line rather than linking to another ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required