A definition list that uses javascript to collapse the definitions, then expand them and collapse them when you click on the definition term. If javascript is disabled, the definitions will remain expanded.
Simply add the js in the head of your document and assign the class of "collapseList" to the "dl" tag of the list you wish to apply this to. Will work if added to multiple lists. The definition list, must have the same amount of "dd"s as "dt"s
View source to see code
- Definition Term
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent scelerisque lacinia erat. In elementum turpis eu purus. Duis nunc enim, commodo sed, auctor in, suscipit in, dolor. Ut eget ligula. Nunc nec tortor sed pede rutrum condimentum. Aliquam sit amet tellus ac tellus faucibus pellentesque. Aliquam ultrices tincidunt nisi. Etiam imperdiet. Pellentesque sed dui. Duis vulputate condimentum nibh. In facilisis. Etiam euismod. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam ultrices adipiscing tortor. Aliquam bibendum lacus eget metus. Nullam placerat lorem quis nisl. Maecenas pulvinar, sapien sit amet elementum volutpat, turpis leo scelerisque urna, sed aliquam quam sapien ac nulla.
- Definition Term
- Suspendisse nisi. Praesent volutpat. Quisque libero felis, rhoncus eu, condimentum facilisis, aliquet at, sem. Donec vitae pede. Curabitur libero ipsum, euismod a, pretium sit amet, bibendum vel, dui. Curabitur elementum massa id orci. Aliquam scelerisque magna et ante. Proin porta tempus sem. Sed mollis. Fusce luctus iaculis lacus. Nullam varius laoreet eros. Vivamus nec magna.
- Definition Term
- Sed nec est dictum diam varius consequat. Pellentesque facilisis metus non nunc. Pellentesque nulla. In dui. Nunc ipsum dolor, congue vel, venenatis vitae, feugiat et, massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse interdum risus eu arcu. Phasellus a orci. Etiam ac eros ut nisl dignissim luctus. Donec et urna. Phasellus at ipsum. Maecenas faucibus sapien in massa. Donec et metus in odio lobortis auctor.
- Definition Term
- Vestibulum euismod semper sem. Mauris faucibus sapien in felis consectetuer semper. Maecenas mauris. Phasellus ultricies quam ut diam. Fusce aliquam rhoncus mi. In hac habitasse platea dictumst. Fusce semper tincidunt dolor. Curabitur sagittis suscipit tellus. Nam nec lorem. Donec sit amet erat quis libero varius dapibus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
- Definition Term
- Mauris leo. Fusce et quam. Sed vel nibh. Pellentesque molestie, diam in sollicitudin auctor, felis nisi posuere urna, eget interdum nibh lacus vel nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque lorem. Nullam dui magna, ultricies vitae, lobortis nonummy, tristique vel, leo. Aliquam iaculis ante tincidunt augue. Praesent pede libero, condimentum ac, bibendum id, tempor sed, massa. Aenean ac ipsum. Curabitur ultrices. Suspendisse feugiat quam ut metus. Fusce nec enim. Etiam et nibh at erat condimentum tincidunt. Nulla tincidunt ipsum vel ipsum. Duis ipsum. Cras laoreet elit non massa. Nullam rhoncus augue at nunc.