Exercises
To complete these exercises, you will need the index.html
file for this chapter, as well as the finished JavaScript code as found in complete.js
. These files can be downloaded from the Packt Publishing website at http://www.packtpub.com/support.
The challenge exercise may require use of the official jQuery documentation at http://api.jquery.com/.
Alter the stylesheet to hide the contents of the page initially. When the page is loaded, fade in the contents slowly.
Give each paragraph a yellow background only when the mouse is over it.
Make a click of the title (
<h2>
) simultaneously make it fade to 25% opacity and get a left margin of20px
, then when this is complete, fade the speech text to 50% opacity.Challenge: React to presses of the arrow keys by smoothly moving the switcher box 20 pixels in the corresponding direction. The key codes for the arrow keys are:
37
(left),38
(up),39
(right), and40
(down).