HTML and CSS Reference
Because the function to be applied is a fade-in effect, CSS is used to make sure the image is not ini-
tially shown through the display: none declaration:
jQuery library. To make sure that the document is fully loaded before any code is invoked, jQuery
uses a special function, $(document).ready() . The full code for the jQuery fadeIn() function is
Essentially, this script is saying that when the document is ready, fade in the image with the id of
#fadePhoto for a duration of 1,000 milliseconds, or 1 second. The transition is very smooth, as
shown in Figure 22-2, where the picture has faded in about 50 percent.