Homework #14

For this exercise, you will be exploring a Javascript library like jQuery.

1. My instructions here will be for the jQuery. If you'd like to use another jQuery tutorial, or another Javascript library entirely, you're free to do so. Just make sure to include a link to the tutorial so we know what you're doing.

2. Create an HTML page (that's empty for now) that you'll create/manipulate as you explore. Add code to load the jQuery library and a code.js JavaScript file that you'll also create.

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <script src="code.js"></script>
   <script>
     // page-specific code goes here
   </script>
   

3. Have a look at the Using jQuery Core documentation. Depending on your experience, you may want to look back to the About jQuery and JavaScript 101 topics (but it's probably not necessary to read every detail there).

4. Add code to your JavaScript file that demonstrates these jQuery features. Obviously, you might have to add content to your HTML so you can see your demos working (and maybe create a CSS file if you need it). Create a small demo of each of these jQuery features:

   • Selecting elements: select elements by tag name (like all <li>s), by id, and by context (like all <li>s inside any <ul>).
   • Working with selections and manipulating elements: add a class to everything selected, add a new element after a selected element, delete selected elements.
   • Manipulate the CSS of an element with jQuery.
   • Use an effect on an element.

   Don't spend time making big/complicated/exciting examples. Just show us that you know the basics of what jQuery can do for you.

5. For jQuery events, make something happen as a result of a click, and a mouseover event. (These could be things from the previous set of examples.)

6. Add some notes to your HTML so we can see what's happening. (Just something like “click this button to see the CSS change” so we're not totally confused about what you did.)

7. Have a look at the jQuery Plugin Registry. Find two plugins you think are interesting. Write a short paragraph about each one in your HTML.

8. Commit and push your work in the repository to the server.

9. Send an email to zju.webdev@gmail.com with the subject “Homework #14”. Include the path within your repository where we'll find your work. Be sure to include your student number in the body of the email so we find the right repository.