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 ...
Get jQuery and JavaScript Phrasebook now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
