12.11 Moving Face Web Page

As promised, in this section, we present a complete web page that applies transformation operations to the previous Face web page. This time we use black for the face’s lines instead of orange. But other than that, the new page displays the face the same as before, with the face centered and upright. The new web page adds Rotate and Up buttons below the face. Clicking the Rotate button causes the face to rotate one-eighth of a complete revolution clockwise. Clicking the Up button causes the face to move up by one-third of the circle’s radius, where “up” means in the direction of the face’s forehead. Take a look at FIGURE 12.18, which shows what happens after the user clicks the Rotate button once and then the Up ...

Get Web Programming with HTML5, CSS, and JavaScript 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.