marcosbrasil/image_map.html

## image_map.html
<html>
	<head>
		<script type="text/javascript">
			function coordenadas(event)
			{
				var x=event.clientX;
				var y=event.clientY;
				var coord = x + "," + y;
				return coord;
			}

			function listar(event){
				var coord = coordenadas(event);
				var texto = document.getElementById("listacoord");
				texto.value += coord + ",";
			}
		</script>
	</head>

	<body>
		<!-- AQUI VOCE COLOCA O ENDERECO DA IMAGEM QUE QUER MAPEAR -->
		<!-- SUBSTITUA "IMAGEM.JPG" PELA SUA IMAGEM -->
		<img src="image_footer.png" style="border-style:none;position:absolute;top:0px;left:0px" onmousedown="listar(event)">

		<p style="position:absolute;top:400px;">Clique na imagem para marcar as coordenadas.<br/>
		Copie estas coordenadas e cole dentro no atributo coords="" da tag <AREA>.<br/>
		Não esqueça de apagar a vírgula no final do da linha gerada.</p>

		<textarea type="text" style="position:relative;top:500px;" id="listacoord" cols="100" rows="8"></textarea>
	</body>
</html>
	<html>
	<head>
	<script type="text/javascript">
	function coordenadas(event)
	{
	var x=event.clientX;
	var y=event.clientY;
	var coord = x + "," + y;
	return coord;
	}

	function listar(event){
	var coord = coordenadas(event);
	var texto = document.getElementById("listacoord");
	texto.value += coord + ",";
	}
	</script>
	</head>

	<body>
	<!-- AQUI VOCE COLOCA O ENDERECO DA IMAGEM QUE QUER MAPEAR -->
	<!-- SUBSTITUA "IMAGEM.JPG" PELA SUA IMAGEM -->
	<img src="image_footer.png" style="border-style:none;position:absolute;top:0px;left:0px" onmousedown="listar(event)">

	<p style="position:absolute;top:400px;">Clique na imagem para marcar as coordenadas.<br/>
	Copie estas coordenadas e cole dentro no atributo coords="" da tag <AREA>.<br/>
	Não esqueça de apagar a vírgula no final do da linha gerada.</p>

	<textarea type="text" style="position:relative;top:500px;" id="listacoord" cols="100" rows="8"></textarea>
	</body>
	</html>