Advertisement
Guest User

Source

a guest
Dec 8th, 2019
923
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // JAVASCRIPT
  2.  
  3. document.addEventListener("load", function(){
  4.   var allSelect = document.getElementById("govLinks");
  5.   for (var i = 0; i < allSelect.length; i++) {
  6.     allSelect[i].onchange = function() {
  7.       location.href = allSelect[i].value;
  8.     };
  9.   }
  10. })
  11.  
  12.  
  13. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ HTML ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  14. <!DOCTYPE html>
  15. <html lang="en">
  16. <head>
  17.    <!--
  18.     New Perspectives on HTML5, CSS3, and JavaScript 6th Edition
  19.     Tutorial 13
  20.     Case Problem 1
  21.    
  22.     Monroe Public Library Government Links
  23.     Author:
  24.     Date:
  25.  
  26.     Filename: mpl_links.html
  27.    -->
  28.    
  29.    <title>Monroe Public Library List of Government Sites</title>
  30.    <meta charset="utf-8" />
  31.    <link href="mpl_base.css" rel="stylesheet"  />
  32.    <link href="mpl_layout.css" rel="stylesheet"  />
  33.  
  34.    <script src="mpl_links.js" async></script>
  35.  
  36. </head>
  37.  
  38. <body>
  39.    <header>
  40.       <img src="mpl_logo.png" alt="Monroe Public Library" />  
  41.       <nav id="top">
  42.          <ul>
  43.            <input type="text" placeholder="Locate a Title" name="gSearch" id="gSearch" />
  44.            <label for="gSearch"><img src="mpl_search.png" alt="search" /></label>            
  45.          </ul>
  46.       </nav>
  47.       <nav id="middle">
  48.          <ul>
  49.             <li><a href="#">Materials</a></li>
  50.             <li><a href="#">eLibrary</a></li>
  51.             <li><a href="#">Events</a></li>
  52.             <li><a href="#">Services</a></li>
  53.             <li><a href="#">Collections</a></li>
  54.             <li><a href="#">Support</a></li>          
  55.          </ul>
  56.       </nav>      
  57.    </header>
  58.    
  59.    <section>
  60.       <nav id="left">
  61.         <p>Monroe Public Library<br />
  62.            580 Main Street<br>
  63.            Monroe, OH  45050<br />
  64.            (513) 555-0211
  65.          </p>
  66.          <ul>
  67.             <li class="newgroup"><a href="#">Books</a></li>
  68.             <li><a href="#">Videos</a></li>
  69.             <li><a href="#">Music</a></li>                        
  70.             <li><a href="#">eMedia</a></li>
  71.             <li><a href="#">Magazines</a></li>
  72.             <li><a href="#">Local History</a></li>
  73.             <li class="newgroup"><a href="#">Library Cards</a></li>
  74.             <li><a href="#">Card FAQ</a></li>
  75.             <li><a href="#">Borrowing &amp; Fees</a></li>
  76.             <li><a href="#">Interlibrary Loans</a></li>
  77.             <li class="newgroup"><a href="#">MPL Calendar</a></li>
  78.             <li><a href="#">Meeting Rooms</a></li>
  79.             <li><a href="#">Adult Events</a></li>
  80.             <li><a href="#">Teen Events</a></li>
  81.             <li><a href="#">Kid Events</a></li>
  82.             <li><a href="#">Classes</a></li>
  83.             <li class="newgroup"><a href="#">Online Resources</a></li>
  84.             <li><a href="#">Ask a Librarian</a></li>
  85.             <li><a href="#">Computers &amp; Internet</a></li>
  86.             <li><a href="#">Community Info</a></li>
  87.             <li class="newgroup"><a href="#">Hours of Operation</a></li>
  88.             <li><a href="#">Directions</a></li>      
  89.         </ul>                                              
  90.       </nav>
  91.      
  92.       <article>
  93.          <form id="govLinks" name="govLinks">
  94.          <h1>Government Sites on the Web</h1>
  95.  
  96.          <p>Select a site from one of the drop-down lists below.</p>
  97.          <table>
  98.             <tr><td>Executive Branch</td>
  99.                 <td><select name="executive" id="executive" class="optionLinks">
  100.                     <option value="#">Select a Web site</option>
  101.                     <option value="http://www.whitehouse.gov">The White House</option>
  102.                     <option value="http://www.usda.gov">Department of Agriculture</option>
  103.                     <option value="http://www.doc.gov">Department of Commerce</option>
  104.                     <option value="http://www.defenselink.mil">Department of Defense</option>
  105.                     <option value="http://www.ed.gov">Department of Education</option>
  106.                     <option value="http://www.energy.gov">Department of Energy</option>
  107.                     <option value="http://www.hhs.gov">Department of Health and Human Services</option>
  108.                     <option value="http://www.whitehouse.gov/homeland">Department of Homeland Security</option>
  109.                     <option value="http://www.hud.gov">Department of Housing and Urban Development</option>
  110.                     <option value="http://www.doi.gov">Department of the Interior</option>
  111.                     <option value="http://www.usdoj.gov">Department of Justice</option>
  112.                     <option value="http://www.dol.gov">Department of Labor</option>
  113.                     <option value="http://www.state.gov">Department of State</option>
  114.                     <option value="http://www.ustreas.gov">Department of the Treasury</option>
  115.                     </select>
  116.                 </td>
  117.             </tr>
  118.             <tr><td>Legislative Branch</td>
  119.                 <td><select name="legislative" id="legislative" class="optionLinks">
  120.                     <option value="#">Select a Web site</option>
  121.                     <option value="http://www.house.gov">House Web Site</option>
  122.                     <option value="http://clerk.house.gov/">Clerk of the House</option>
  123.                     <option value="http://www.senate.gov">Senate Web Site</option>
  124.                     <option value="http://www.senate.gov/general/contact_information/senators_cfm.cfm">Senators' Web Sites</option>
  125.                    <option value="http://www.senate.gov/artandhistory/history/common/generic/Senate_Historical_Office.htm">Senate Historic Office</option>
  126.                    <option value="http://www.cq.com">Congressional Quarterly</option>
  127.                    <option value="http://www.loc.gov/">Library of Congress</option>
  128.                    <option value="http://www.gao.gov/">Government Accountability Office</option>
  129.                    <option value="http://www.cbo.gov/">Congressional Budget Office</option>
  130.                    </select>
  131.                </td>
  132.            </tr>
  133.            <tr><td>Judicial Branch</td>
  134.                <td><select name="judicial" id="judicial" class="optionLinks">
  135.                    <option value="#">Select a Web site</option>
  136.                    <option value="http://www.uscourts.gov">U.S. Courts</option>
  137.                    <option value="https://www.supremecourt.gov/">U.S. Supreme Court</option>
  138.                    <option value="http://www.uscourts.gov/courtsofappeals.html">U.S. Courts of Appeals</option>
  139.                    </select>
  140.                </td>
  141.            </tr>
  142.            <tr><td>State Governments</td>
  143.                <td><select name="state" id="state" class="optionLinks">
  144.                    <option value="#">Select a Web site</option>
  145.                    <option value="http://www.statelocalgov.net/index.cfm">State and Local Government on the Net</option>
  146.                    <option value="http://www.statelocalgov.net/state-al.cfm">Alabama</option>
  147.                    <option value="http://www.statelocalgov.net/state-ak.cfm">Alaska</option>
  148.                    <option value="http://www.statelocalgov.net/state-az.cfm">Arizona</option>
  149.                    <option value="http://www.statelocalgov.net/state-ar.cfm">Arkansas</option>
  150.                    <option value="http://www.statelocalgov.net/state-ca.cfm">California</option>
  151.                    <option value="http://www.statelocalgov.net/state-co.cfm">Colorado</option>
  152.                    <option value="http://www.statelocalgov.net/state-ct.cfm">Connecticut</option>
  153.                    <option value="http://www.statelocalgov.net/state-de.cfm">Delaware</option>
  154.                    <option value="http://www.statelocalgov.net/state-dc.cfm">District of Columbia</option>
  155.                    <option value="http://www.statelocalgov.net/state-fl.cfm">Florida</option>
  156.                    <option value="http://www.statelocalgov.net/state-ga.cfm">Georgia</option>
  157.                    <option value="http://www.statelocalgov.net/state-hi.cfm">Hawaii</option>
  158.                    <option value="http://www.statelocalgov.net/state-id.cfm">Idaho</option>
  159.                    <option value="http://www.statelocalgov.net/state-il.cfm">Illinois</option>
  160.                    <option value="http://www.statelocalgov.net/state-in.cfm">Indiana</option>
  161.                    <option value="http://www.statelocalgov.net/state-ia.cfm">Iowa</option>
  162.                    <option value="http://www.statelocalgov.net/state-ks.cfm">Kansas</option>
  163.                    <option value="http://www.statelocalgov.net/state-ky.cfm">Kentucky</option>
  164.                    <option value="http://www.statelocalgov.net/state-la.cfm">Louisana</option>
  165.                    <option value="http://www.statelocalgov.net/state-me.cfm">Maine</option>
  166.                    <option value="http://www.statelocalgov.net/state-md.cfm">Maryland</option>
  167.                    <option value="http://www.statelocalgov.net/state-ma.cfm">Massachusetts</option>
  168.                    <option value="http://www.statelocalgov.net/state-mi.cfm">Michigan</option>
  169.                    <option value="http://www.statelocalgov.net/state-mn.cfm">Minnesota</option>
  170.                    <option value="http://www.statelocalgov.net/state-ms.cfm">Mississippi</option>
  171.                    <option value="http://www.statelocalgov.net/state-mo.cfm">Missouri</option>
  172.                    <option value="http://www.statelocalgov.net/state-mn.cfm">Montana</option>
  173.                    <option value="http://www.statelocalgov.net/state-ne.cfm">Nebraska</option>
  174.                    <option value="http://www.statelocalgov.net/state-nv.cfm">Nevada</option>
  175.                    <option value="http://www.statelocalgov.net/state-nh.cfm">New Hampshire</option>
  176.                    <option value="http://www.statelocalgov.net/state-nj.cfm">New Jersey</option>
  177.                    <option value="http://www.statelocalgov.net/state-nm.cfm">New Mexico</option>
  178.                    <option value="http://www.statelocalgov.net/state-ny.cfm">New York</option>
  179.                    <option value="http://www.statelocalgov.net/state-nc.cfm">North Carolina</option>
  180.                    <option value="http://www.statelocalgov.net/state-nd.cfm">North Dakota</option>
  181.                    <option value="http://www.statelocalgov.net/state-oh.cfm">Ohio</option>
  182.                    <option value="http://www.statelocalgov.net/state-ok.cfm">Oklahoma</option>
  183.                    <option value="http://www.statelocalgov.net/state-or.cfm">Oregon</option>
  184.                    <option value="http://www.statelocalgov.net/state-pa.cfm">Pennsylvania</option>
  185.                    <option value="http://www.statelocalgov.net/state-ri.cfm">Rhode Island</option>
  186.                    <option value="http://www.statelocalgov.net/state-sc.cfm">South Carolina</option>
  187.                    <option value="http://www.statelocalgov.net/state-sd.cfm">South Dakota</option>
  188.                    <option value="http://www.statelocalgov.net/state-tn.cfm">Tennessee</option>
  189.                    <option value="http://www.statelocalgov.net/state-tx.cfm">Texas</option>
  190.                    <option value="http://www.statelocalgov.net/state-ut.cfm">Utah</option>
  191.                    <option value="http://www.statelocalgov.net/state-vt.cfm">Vermont</option>
  192.                    <option value="http://www.statelocalgov.net/state-va.cfm">Virginia</option>
  193.                    <option value="http://www.statelocalgov.net/state-wa.cfm">Washington</option>
  194.                    <option value="http://www.statelocalgov.net/state-wv.cfm">West Virginia</option>
  195.                    <option value="http://www.statelocalgov.net/state-wi.cfm">Wisconsin</option>
  196.                    <option value="http://www.statelocalgov.net/state-wy.cfm">Wyoming</option>
  197.                    </select>
  198.                </td>
  199.            </tr>
  200.         </table>
  201.         </form>    
  202.      </article>      
  203.  
  204.   </section>
  205.  
  206.   <footer>
  207.      <p>Monroe Public Library &copy; 2018 All Rights Reserved</p>
  208.   </footer>
  209. </body>
  210. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement