Hola otra vez:
Preparé un ejemplo de la manera que te comenté anteriormente:
http://www.pepemolina.com/pruebas/prueba152.html
Se pasan los valores con el método get y se procesa la entrada para descubrir las imágenes...
El código de la página completa es este:
Código:
<html>
<head>
<style>
img {visibility: hidden;}
h1 {text-align: center; color: blue; background-color: #eeeeee;}
#a {position: absolute; top: 300px; left: 100px; visibility: visible; cursor: pointer;}
#b {position: absolute; top: 150px; left: 100px; visibility: visible; cursor: pointer;}
#c {position: absolute; top: 300px; left: 200px; visibility: visible; cursor: pointer;}
#d {position: absolute; top: 300px; left: 400px; visibility: visible; cursor: pointer;}
</style>
<script language="JavaScript">
<!--
var actuales = "";
function inicio() {
var URL = location.href.split("?");
if (URL.length > 1) {
datos = URL[1].split("&");
for (lectura in datos) {
actual = datos[lectura].split("=");
switch (actual[0]) {
case "mostrados":
actuales = actual[1];
break;
otherwise:
break;
}
}
}
with (document.forms["dibujos"]) {
action = URL[0];
mostrados.value = actuales;
if (actuales != "")
for (var i = 0, max = actuales.length; i < max; i ++)
document.images[actuales.charAt(i)].style.visibility = "visible";
}
}
function chequeo(yo) {
if (document.images[yo].style.visibility != "visible") {
with(document.forms["dibujos"]) {
mostrados.value += yo;
submit();
}
}
else
alert(document.images[yo].style.visibility);
}
//-->
</script>
</head>
<body onload="inicio()">
<h1>
Buscando emoticones
</h1>
<form name="dibujos" method="get" action="">
<input type="hidden" name="mostrados" value="">
<div id="a" onclick="chequeo(this.id);" >
<img name="a" src="miemoticon.gif" />
</div>
<div id="b" onclick="chequeo(this.id);" >
<img name="b" src="miemoticon.gif" />
</div>
<div id="c" onclick="chequeo(this.id);" >
<img name="c" src="miemoticon.gif" />
</div>
<div id="d" onclick="chequeo(this.id);" >
<img name="d" src="miemoticon.gif" />
</div>
</form>
</body>
</html>
Saludos