Assignment for Week 12

1. Create a new HTML file (follow the instructions in Assignment 1 if needed, up to the step where you create the <title>) element.
2. Add a <script> element pointing to a CDN-hosted jQuery file.
3. Go to the Bootstrap site and customize a version that includes these components:
   • Buttons
   • Icons
   • Modals
   • Close icon
   • Utilities
   and the Modals jQuery plugin.
4. Download, extract, and place the Bootstrap folder into the same folder as the HTML file.
5. Add <link> and <script> elements pointing to the Bootstrap CSS and JS files, respectively.
6. Create a JS file of your own and include a <script> reference to it in the HTML file.
7. Add a <div> with a class of "modal hide". Put some text inside it.
8. Add a <button> element with some text in it.
9. Add behavior that makes clicking the button cause a the <div> to appear. jQuery functions you should use:
   • $
   • .click
   • .modal
   Since these are <button> elements and not <input type="submit">, you don't need to return false at the end of your click callback, as buttons do nothing by default.

Extra credit:

1. Add a <button> inside the <div>, with the text "Close".
2. Add behavior that makes clicking that <button> close the <div>.

1. Customize Bootstrap further to include, as well as the components above:
   • Nav, tabs, and pills
   • Button groups and dropdowns
   • Dropdowns
   and the Dropdowns jQuery plugin.
2. Create an unordered list with anchors and sublists (<a> and <ul> elements inside each <li>).
3. Give the main <ul> a class of "nav".
4. Give each <li> child of the main <ul> a class of "dropdown".
5. Give each <a> a class of "dropdown-toggle".
6. Give each <ul> inside each <li> a class of "dropdown-menu".
7. Add behavior that makes clicking the dropdown-toggle elements cause the dropdowns to appear. jQuery functions to use:
   • $
   • .dropdown