Web Design

(Nancy Kaufman) #1

224


Create an Image Gallery with jQuery (continued)


@ In the body, type <div
id=”slider”>.


Type <img src=”?”


alt=”?” />, replacing the
first? with the path to the
first image you want for the
slider, and the second with
appropriate alternate text for
the image.


$ Repeat Step 13 for each
additional image you want to
display in the slider.


% Type

.


^ In the head section, below
the other script tags, type
<script type=”text/
javascript”>.


& Press.



  • Type $(window).
    load(function() {.


Create an Image Gallery with jQuery (continued)


A


concern anytime you use JavaScript is what will happen to your page if a user disabled scripting
in his browser. The Nivo slider uses a simple set of HTML <img> tags with a <div> to display

the images, so this script degrades nicely — the user with scripting disabled will simply see the


images on the page without the animated effect. The same is true for disabled users. Blind users


relying on a screen reader will hear the page as if the script did not exist, so they will be given the


alternate text for the images.


16


13


12


18


15


14


13

Free download pdf