Chapter 11

Dynamic HTML and Ajax

IN THIS CHAPTER

  • Creating mouseovers
  • Using dynamic style sheets
  • Writing documents to the browser
  • Updating part of a page with dynamic HTML methods
  • Updating part of a page with dynamic HTML properties
  • Creating elements on the fly
  • Updating tables with data
  • Getting the user's attention with animation

Working with Web pages on the fly is central to Ajax. Chapter 10 covered working with Web pages using cascading style sheets. This chapter discusses another way of working with Web pages on the fly: dynamic HTML.

Dynamic HTML is a powerhouse of options for the Ajax programmer, and you're going to see the best of it in this chapter.

Creating Mouseovers

This first dynamic HTML example demonstrates the use of dynamic styles by using the onmouseover attribute to handle mouse rollovers. In this example, positioning the mouse over some text changes the text's size, enlarging it. You can see this example, mouseOver.html, in Figure 11.1.

When you position the mouse over the text in this application, that text gets enlarged, as shown in Figure 11.2.

FIGURE 11.1 The mouseOver application

images

FIGURE 11.2 Enlarging text with dynamic styles

images

This example simply uses the onmouseover attribute of a <span> element to change the font size:

<html> <head> <title> Using Dynamic ...

Get Ajax Bible now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.