In this article we will continue on the subject of AJAX interface widgets. Today’s topic will be a simple Accordion component – an interface element allowing user to collapse and expand portions of content (further referred to as “panels”) organized in a column-like layout. External content can be loaded dynamically as the container expands (the AJAX part).
In addition a previously expanded container can collapse as the
current one expands to free up the screen space and eliminate
scrolling.
To add a little excitement we will animate expanding of the panels once the eternal content has been successfully loaded.
We won’t rely on any server-side technology while working on this article; however in order for AJAX part to work you will need to test the resulting web page on a web server.
Alex July is a Vancouver-based (Canada, British Columbia) Web Developer/ Graphic Artist who has an extensive experience in both creative realms.
He is also a host of Linecraft.com where he is showcasing his skills and sharing experience with the developers community. For the past 3 years Alex has been focusing on the development of Rich Internet Applications using Macromedia Flash technology.
When away from the computer Alex is practicing Martial Arts, playing guitar and enjoying time with his wonderful family.
Why didn't you use DIV's instead of tables?
Why each panels gets bigger once opened? I suppose something DW CS3 Spry Accordion alike would be more interesting.
Thanks,
You must me logged in to write a review.