Definition
This component is an expandable content block used to expose deeper, detailed information while keeping the initial view neat.
Usage
Used on destination class pages to show extra content that doesn't need to be in full view on page load.
Show all Templates
All Templates Referencing this Component
v0
Expandable Content Block
This component contains an H3 tag for the title and a DIV tag with the class "g27block" for the hidden content. The sample shows the DIV with several P elements, however these are optional and other content components such as tables may be used inside this DIV as well.
Unlike some other components, the H3 and "g27block" DIV may NOT be repeated inside the component. If you wish to use several collapsing blocks in a row you must repeat the entire component for each block.
Also, if the g27 div or any of its child elements has an id matching the URL hash, that g27 will be auto-expanded.
Section Header
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam semper. Proin mi lectus, aliquet sed, imperdiet nec, eleifend ac, massa. Pellentesque id sapien pharetra libero porta rutrum. Aenean nibh mi, cursus nec, scelerisque sed, scelerisque nec, diam. Proin suscipit tincidunt velit. Aliquam faucibus pede nec justo. In nonummy, elit vitae facilisis porta, nisi magna faucibus lorem, et tempor velit elit id nunc. Cras ullamcorper justo non lorem. Nunc sagittis consectetuer dolor. Proin sagittis. Integer risus mi, cursus a, dignissim quis, consectetuer sed, nisl. Sed eget urna quis ipsum facilisis adipiscing. Nam aliquet. Fusce id turpis. Mauris tempor nonummy quam. In in arcu. Aenean magna massa, placerat eu, accumsan eu, bibendum a, neque. Duis quam. Vestibulum auctor, ante mollis aliquam accumsan, diam augue hendrerit purus, nonummy varius libero est sit amet metus.
Vivamus adipiscing. Donec diam metus, eleifend non, viverra id, sollicitudin ac, sem. Nullam tincidunt magna cursus arcu. Vivamus a felis sed neque tempus dictum. Vestibulum consectetuer urna eget odio. Aenean ut purus. Aenean condimentum. Nulla facilisi. Donec lacus nulla, mollis at, tempus et, consectetuer a, dolor.
Integer justo. Aliquam placerat pede eu arcu. Donec elementum tincidunt nisl. Phasellus a ipsum et nisl dictum mattis. Nulla in ante vel enim condimentum porttitor. Nunc interdum elit non sem. Aenean varius varius neque. Aliquam erat volutpat. Nullam mattis velit id odio. Phasellus leo nibh, eleifend nec, tempor eget, imperdiet malesuada, nisi. Sed nec turpis in mauris dapibus sollicitudin. Proin euismod. Maecenas auctor tincidunt ligula. Pellentesque in ipsum. Proin suscipit felis nec lectus. Suspendisse sed eros non lectus posuere venenatis. Sed molestie, justo dapibus consequat laoreet, neque est viverra lorem, sed blandit neque massa in ipsum.
v0
x1
Expandable Content, Expanded by Default
This example is the same as the previous example, however the "hidethis" class is removed from the "g27block" DIV so that the content is expanded by default.
Section Header
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam semper. Proin mi lectus, aliquet sed, imperdiet nec, eleifend ac, massa. Pellentesque id sapien pharetra libero porta rutrum. Aenean nibh mi, cursus nec, scelerisque sed, scelerisque nec, diam. Proin suscipit tincidunt velit. Aliquam faucibus pede nec justo. In nonummy, elit vitae facilisis porta, nisi magna faucibus lorem, et tempor velit elit id nunc. Cras ullamcorper justo non lorem. Nunc sagittis consectetuer dolor. Proin sagittis. Integer risus mi, cursus a, dignissim quis, consectetuer sed, nisl. Sed eget urna quis ipsum facilisis adipiscing. Nam aliquet. Fusce id turpis. Mauris tempor nonummy quam. In in arcu. Aenean magna massa, placerat eu, accumsan eu, bibendum a, neque. Duis quam. Vestibulum auctor, ante mollis aliquam accumsan, diam augue hendrerit purus, nonummy varius libero est sit amet metus.
Vivamus adipiscing. Donec diam metus, eleifend non, viverra id, sollicitudin ac, sem. Nullam tincidunt magna cursus arcu. Vivamus a felis sed neque tempus dictum. Vestibulum consectetuer urna eget odio. Aenean ut purus. Aenean condimentum. Nulla facilisi. Donec lacus nulla, mollis at, tempus et, consectetuer a, dolor.
Vivamus adipiscing. Donec diam metus, eleifend non, viverra id, sollicitudin ac, sem. Nullam tincidunt magna cursus arcu. Vivamus a felis sed neque tempus dictum. Vestibulum consectetuer urna eget odio. Aenean ut purus. Aenean condimentum. Nulla facilisi. Donec lacus nulla, mollis at, tempus et, consectetuer a, dolor. Etiam mattis, orci consectetuer eleifend blandit, metus pede vestibulum dolor, ac facilisis eros elit in tortor. Cras ut purus. Curabitur suscipit massa pulvinar enim. Nullam purus. Nunc pharetra lobortis velit. Aliquam erat volutpat. Cras mattis mauris ac est. Sed aliquam. Pellentesque vestibulum pede et ante. Mauris arcu augue, aliquam in, sollicitudin non, fermentum eget, sapien.
No Templates Reference this
v0
x2
Expandable Content Block w/Black Headers
This example is the same as the previous examples but adds the "altheader" class to the outer div to make the H3 headers black instead of orange. This should be used when multiple g27's are used on a page and the orange becomes to overpowering.
No Templates Reference this
|
