Chapter 3. Making a Better FAQ Page

The Frequently Asked Questions (FAQ) page has been a mainstay of all types of websites since the dawn of the Web. It's used as a marketing page, as an attempt to reduce the number of calls or e-mails to a customer service department and as a helpful tool for site visitors to learn more about the company or organization they're dealing with or the products or services they're interested in purchasing.

Though we'll be building an FAQ page, for this example, the expand and collapse techniques will be useful in many different situations—a list of events with event details, a listing of staff or members with bios, a list of products with details—any situation where a listing of items should be quick and easy for site visitors to scan, but where more information should be readily and easily available upon demand when they find the thing they're looking for.

In this chapter, you'll learn:

• How to traverse an HTML document with jQuery
• How to show and hide elements
• How to use simple jQuery animations
• How to easily toggle a class name for an element