Ajax Bible

Chapter 10

Cascading Style Sheets and Ajax

IN THIS CHAPTER

• Creating an Ajax-enabled menu system
• Getting text noticed
• Scrolling text in the status bar
• Styling fonts
• Styling colors
• Setting absolute positions

When you work with Ajax, you're often going to be updating Web pages on the fly, and one of the best ways to do that is by using cascading style sheets (CSS). CSS is one of the more important Ajax-related topics, in fact, simply because updating Web pages is so important in Ajax.

You're going to see Ajax at work with CSS in this chapter; for the full, formal details on CSS, see the CSS specification at www.w3.org/TR/CSS21/.

CSS is great at positioning elements in a Web page and letting you work with those elements (as by using the mouse, for example). And this chapter starts with just such an example: an Ajax-enabled menu system that uses CSS to display drop-down menus and handle mouse events in them. Although this example uses a menu system, the techniques here show you how to create general popups in a Web page, which let you place text or other elements anywhere you want them.

Ajax-Enabled Menus

Take a look at the Ajax-enabled menu system you see in Figure 10.1, with two menus, Fruits and Vegetables.

FIGURE 10.1 The Ajax-enabled menu application

When the user positions ...