continentes2.html

  1. <!DOCTYPE html>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  3. <title>Continentes de la Tierra (2)</title>
  4. <link href="continentes2.css" rel="stylesheet" type="text/css">
  5. <script src="/javascripts/prototype.js" type="text/javascript"></script>
  6. <script src="continentes2.js" type="text/javascript"></script>
  7. </head>
  8.  
  9. <h1>Continentes de la Tierra (2)</h1>
  10. <p>
  11. Uso de un mapa de imagen HTML mejorado mediante Javascript
  12. </p>
  13. <h2>
  14. <a href="continentes.html">Método 1</a>
  15. |
  16. Método 2
  17. </h2>
  18. <div id="animacion">
  19. <input type="checkbox" id="ver_animacion" autocomplete="off" />
  20. <label for="ver_animacion">Animación</label>
  21. </div>
  22. <p>
  23. <img
  24. src="transparente.png"
  25. alt="Continentes de la Tierra"
  26. name="mundo" id="mundo"
  27. width="1488" height="755"
  28. usemap="#mundoMap" />
  29.  
  30. <map name="mundoMap">
  31. shape="poly"
  32. coords="695,2,511,247,635,530,448,674,124,130,206,52,334,4"
  33. href="#america"
  34. alt="América" title="América"
  35. id="area_america" class="america" />
  36. shape="poly"
  37. coords="681,207,573,285,743,553,964,562,939,300,884,320,826,226,742,200"
  38. href="#africa"
  39. alt="África" title="África"
  40. id="area_africa" class="africa" />
  41. shape="poly"
  42. coords="1135,550,1142,456,1250,409,1240,369,1295,273,1483,344,1480,451,1407,586,1335,644"
  43. href="#oceania"
  44. alt="Oceanía" title="Oceanía"
  45. id="area_oceania" class="oceania" />
  46. shape="poly"
  47. coords="524,645,262,718,349,755,1153,755,1262,698,1083,635"
  48. href="#antartida"
  49. alt="Antártida" title="Antártida"
  50. id="area_antartida" class="antartida" />
  51. shape="poly"
  52. coords="680,209,743,200,822,225,797,192,819,180,858,178,899,194,889,139,919,139,901,84,914,73,905,33,694,4,613,111,645,211"
  53. href="#europa"
  54. alt="Europa" title="Europa"
  55. id="area_europa" class="europa" />
  56. shape="poly"
  57. coords="899,9,913,73,902,83,919,138,889,138,898,193,858,179,819,179,798,192,829,232,884,320,961,295,1143,455,1250,409,1241,369,1311,89,1200,25"
  58. href="#asia"
  59. alt="Asia" title="Asia"
  60. id="area_asia" class="asia" />
  61. </map>
  62. </p>
  63.  
  64. <h2>Recursos:</h2>
  65. <ul>
  66. <li>Código:</li>
  67. <ul>
  68. <li><a href="continentes2.css">Estilos CSS</a></li>
  69. <li><a href="continentes2.js">Javascript</a></li>
  70. </ul>
  71. <li>Imágenes</li>
  72. <ul>
  73. <li><a href="continentes_todo.png">continentes_todo.png</a></li>
  74. </ul>
  75. </ul>
  76.  
  77. <p id="autor">ProInf.net &copy;2012</p>
  78. </body>
  79. </html>
  80.  

Proinf.net