Graceful javascript accordion using JQuery part2
First go to JQuery.com and download the last version of the library (links are on the left hand side). I usually work with the minified but not Gzip file, but the choice is up to you.
Now we’ve got the backbone let’s writte a simple html example file:
<dl>
<dt>First definition</dt>
<dd>
<div class="intro">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut viverra enim sed justo. Nulla tincidunt, dui vitae dictum vestibulum, ante</p>
</div>
<div class="newsText">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut viverra enim sed justo. Nulla tincidunt, dui vitae dictum vestibulum, ante
purus convallis augue, id vehicula urna purus a dolor. Vivamus justo nibh, porta a, suscipit ac, scelerisque euismod, urna. Nullam eget
tellus. Donec auctor dolor in tortor. Vivamus tristique porta eros.
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut viverra enim sed justo. Nulla tincidunt, dui vitae dictum vestibulum, ante
purus convallis augue, id vehicula urna purus a dolor. Vivamus justo nibh, porta a, suscipit ac, scelerisque euismod, urna. Nullam eget
tellus. Donec auctor dolor in tortor. Vivamus tristique porta eros.
</p>
</div>
</dd>
</dl>
I am using definition list here as I think it makes sence, you might want to change the markup depending on the context. Definition list are underused. Easy to style or animate with javascript they present the best option here. I have change my first idea and I will do a simple list of item, maybe on the right and side of the page. See example page for finish work
