07/11/2004, 04:12
| |||
| |||
| Puzzle Hola a todos: Estoy interesado en hacer un puzzle sobre las provincias de España, osea recortar todas sus provincias y luego irlas poniendo sobre el mapa hasta finalizar. Yo tengo uno hecho en javascript pero son secciones cuadradas o rectangulares y así no me vale. Si alguien me orienta o sabe de donde coger el codigo se lo agradeceria, o en su defecto modificar el que yo tengo. Un saludo. Gracias |
|
08/11/2004, 13:53
| |||
| |||
| Hola Ramiro, no se como podria hacerlo, pero si entiendes de esto si quieres te paso el codigo para ver si se puede hacer lo que te digo. Lo unico que se manipular en el codigo que tengo son el numero de particiones y las dimensiones de cada celda, que pueden ser cuadradas o rectangulares, pero al ser poligonos irregulares, no se como se haria. Bueno te lo agrego por si acaso: <script> var logDomain = 'www.wanadoo.es'; var logChannel = 'miweb'; var logPath = window.location.href; var i=logPath.indexOf("http://"); if (i>=0) logPath = logPath.substr(i+7); var logPage = ""; </script> <script src="http://www.eresmas.com/js/logs.js"></script> <a href="http://www.mejoratuweb.com"></a> <html> <head> <title>Puzzle</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <!-- ==================== Anwendung: Puzzle II ==================== Copyright (c) 2000 by Dietmar Rabich, Duelmen. Alle Rechte vorbehalten. Version: 1.0 Datum: 1.4.2000 Aenderungen: - --> <META NAME="AUTHOR" CONTENT="Dietmar Rabich"> <META NAME="DESCRIPTION" CONTENT="Anwendung Puzzle II"> <META NAME="PUBLISHER" CONTENT="Dietmar Rabich"> <META NAME="COPYRIGHT" CONTENT="Dietmar Rabich, Dülmen"> <META NAME="LANGUAGE" CONTENT="de"> <META NAME="ROBOTS" CONTENT="NONE"> <META NAME="REPLY-TO" CONTENT="[email protected]"> <META HTTP-EQUIV="CONTENT-LANGUAGE" CONTENT="de"> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; CHARSET=iso-8859-1"> <LINK REV="MADE" TITLE="Dietmar Rabich" HREF="mailto:[email protected]"> <SCRIPT LANGUAGE="JavaScript"> <!-- function neues_spiel() { alert("Por favor, utilice un navegador más moderno") } //--> </SCRIPT> <SCRIPT LANGUAGE="JavaScript1.2"> <!-- // === Parámetros === var img_width = 80 // Ancho de imagen var img_height = 75 // Alto de imagen var feld_breite = 5 // Número de imágenes en horizontal var feld_hoehe = 4 // Número de imágenes en vertical var platzhalter = "/carpeta/leer.gif" //Imagen vacia var bild = "/carpeta/bild" //Parte de la imagen (la extensión jpg y el número son rellenados automáticamente) // === Variables === var anzahl_bilder = feld_breite * feld_hoehe var gesamt = feld_breite * feld_hoehe var unten = 0 var seite = 0 var spalten = 0 var bildquelleintern = "BildQ" var bildzielintern = "BildZ" var quelle = new Array() var ziel = new Array() var merker_stein = -1 var merker_feld = -1 var spielstatus = 0 // === Preparación === if((feld_breite + 6) * img_width < 600) { unten = gesamt % 6 if(unten <= 1) unten += 6 gesamt -= unten seite = gesamt / 6 spalten = 3 } else { unten = gesamt % 4 if(unten <= 1) unten += 4 gesamt -= unten seite = gesamt / 4 spalten = 2 } // Mostrar en la barra de estado function zeige(nr, zielfeld) { if(spielstatus == 0) status = ((zielfeld ? ziel[nr] : quelle[nr]) != -1) ? "Esta casilla puede ser elegida" : "Esta casilla está vacía" else status = ((zielfeld ? ziel[nr] : quelle[nr]) == -1) ? "Esta casilla puede ser ocupada" : "Esta casilla no puede ser ocupada" } // Borrar información en la barra de estado function loesche() { status = "" } // Comprobar que la imagen está cargada function fertig() { var i for(i = 0; i < anzahl_bilder; i++) if(ziel[i] != i) return false return true } // Pulsar sobre la imagen function klick(nr, zielfeld) { // Aviso de no hay imagen if(spielstatus == 0) { if((zielfeld ? ziel[nr] : quelle[nr]) == -1) { alert("Ya existe una ficha en esta posición") return } merker_stein = nr merker_feld = zielfeld spielstatus = 1 return } // Aviso de imagen de origen if(spielstatus == 1) { if((zielfeld ? ziel[nr] : quelle[nr]) != -1) { alert("Ya existe una ficha en esta posición") return } if(zielfeld) { ziel[nr] = merker_feld ? ziel[merker_stein] : quelle[merker_stein] document.images[bildzielintern + nr].src = bild + ziel[nr] + ".jpg" } else { quelle[nr] = merker_feld ? ziel[merker_stein] : quelle[merker_stein] document.images[bildquelleintern + nr].src = bild + quelle[nr] + ".jpg" } if(merker_feld) ziel[merker_stein] = -1 else quelle[merker_stein] = -1 document.images[(merker_feld ? bildzielintern : bildquelleintern) + merker_stein].src = platzhalter spielstatus = 0 if(fertig()) alert("¡Acabado! ¡Enhorabuena!") return } } // Casillas de juego function spielfeld() { // Zielfeld (in der Mitte) function zielfeld() { var z = "" var i var j var nr z += "<TABLE BORDER=\"0\" CELLSPACING=\"0\" CELLPADDING=\"0\">\n" for(i = 0; i < feld_hoehe; i++) { z += "<TR ALIGN=\"CENTER\" VALIGN=\"MIDDLE\">\n" for(j = 0; j < feld_breite; j++) { nr = feld_breite * i + j z += "<TD><A HREF=\"javascript:klick(" + nr + ", true)\" onMouseOver=\"zeige(" + nr + ", true); return true\" onMouseOut=\"loesche()\"><IMG SRC=\"" + platzhalter + "\" WIDTH=\"" + img_width + "\" HEIGHT=\"" + img_height + "\" BORDER=\"1\" NAME=\"" + bildzielintern + nr + "\" ALT=\"\"></A></TD>\n" } z += "</TR>\n" } z += "</TABLE>" return z } // Casillas de origen ( izquierda, derecha y abajo) function wahlfeld(nr) { var i var j var offset = 0 var nr z = "" z += "<TABLE BORDER=\"0\" CELLSPACING=\"0\" CELLPADDING=\"4\">\n" if(nr == 1 || nr == 2) { offset = (nr == 1) ? 0 : (spalten * seite) for(i = 0; i < seite; i++) { z += "<TR ALIGN=\"CENTER\" VALIGN=\"MIDDLE\">\n" for(j = 0; j < spalten; j++) { nr = offset + spalten * i + j z += "<TD><A HREF=\"javascript:klick(" + nr + ", false)\" onMouseOver=\"zeige(" + nr + ", false); return true\" onMouseOut=\"loesche()\"><IMG SRC=\"" + bild + String(quelle[nr]) + ".jpg\" WIDTH=\"" + img_width + "\" HEIGHT=\"" + img_height + "\" BORDER=\"1\" NAME=\"" + bildquelleintern + nr + "\" ALT=\"\"></A></TD>\n" } z += "</TR>\n" } } else if(nr == 3) { offset = 2 * spalten * seite z += "<TR ALIGN=\"CENTER\" VALIGN=\"MIDDLE\">\n" for(i = 0; i < unten; i++) { nr = offset + i z += "<TD><A HREF=\"javascript:klick(" + nr + ", false)\" onMouseOver=\"zeige(" + nr + ", false); return true\" onMouseOut=\"loesche()\"><IMG SRC=\"" + bild + String(quelle[nr]) + ".jpg\" WIDTH=\"" + img_width + "\" HEIGHT=\"" + img_height + "\" BORDER=\"1\" NAME=\"" + bildquelleintern + nr + "\" ALT=\"\"></A></TD>\n" } z += "</TR>\n" } z += "</TABLE>" return z } with(document) { writeln("<DIV ALIGN=\"CENTER\">") writeln("<TABLE BORDER=\"0\" CELLSPACING=\"1\" CELLPADDING=\"4\">") writeln("<TR ALIGN=\"CENTER\" VALIGN=\"MIDDLE\">") writeln("<TD ROWSPAN=\"2\" WIDTH=\"30%\">" + wahlfeld(1) + "</TD>") writeln("<TD WIDTH=\"40%\">" + zielfeld() + "</TD>") writeln("<TD ROWSPAN=\"2\" WIDTH=\"30%\">" + wahlfeld(2) + "</TD>") writeln("</TR>") writeln("<TR ALIGN=\"CENTER\" VALIGN=\"MIDDLE\">") writeln("<TD WIDTH=\"40%\">" + wahlfeld(3) + "</TD>") writeln("</TR>") writeln("</TABLE>") writeln("</DIV>") } } // Mezclar piezas function init() { var i spielstatus = 0 for(i = 0; i < anzahl_bilder; i++) { quelle[i] = i ziel[i] = -1 } var a var b var temp for(i = 0; i < 4 * anzahl_bilder; i++) { a = Math.floor(Math.random() * anzahl_bilder) b = Math.floor(Math.random() * anzahl_bilder) temp = quelle[a] quelle[a] = quelle[b] quelle[b] = temp } } // Nuevo juego function neues_spiel() { var i init() for(i = 0; i < anzahl_bilder; i++) { document.images[bildquelleintern + i].src = (quelle[i] == -1) ? platzhalter : (bild + quelle[i] + ".jpg") document.images[bildzielintern + i].src = (ziel[i] == -1) ? platzhalter : (bild + ziel[i] + ".jpg") } } //--> </SCRIPT> </head> <body bgcolor="#ee0066"> <h1>Buenooooo¡¡¡¡ <A href="Puzzle1.htm"> </A></h1> <H1 ALIGN="center">La prima del de Zumosol.</H1> <NOSCRIPT><P ALIGN="center"><BIG>¡Por favor, activa JavaScript!</BIG></P></NOSCRIPT> <p> <SCRIPT LANGUAGE="JavaScript1.2"> <!-- init() spielfeld() //--> </SCRIPT> </p> <form name="form1" method="post" action=""> </form> <p> <A href="Puzzle1.htm"><font size="4" color="#00ff00">Ir a puzzle 1</font></A></p> <p> <small><small><A href="Puzzle2.htm"><font size="4" color="#00ff00">Ir a puzzle2</font></A></small></small></p> <p> <A href="index.htm"><font size="4" color="#00ff00">Principal</font></A> </p> <P ALIGN="center"><BIG><BIG><STRONG>[ <A href="javascript:neues_spiel()">Nueva partida</A> ]</STRONG></BIG></BIG></P> <P ALIGN="center"><SMALL><SMALL>Copyright © 2000 by <A HREF="http://www.rabich.de/" TARGET="_top">Dietmar Rabich</A>, Dülmen. Alle Rechte vorbehalten.</SMALL></SMALL></P> <P ALIGN="center"> </P> <P ALIGN="center"> </P> <P ALIGN="center"> </P> </body> </html> <iframe scrolling="no" MARGINHEIGHT=0 MARGINWIDTH=0 frameBorder=0 id="niframe" width=1 height=1 src="http://perso.wanadoo.es/pagiperso/pagi_perso_w.htm"></iframe> </div> |
|
09/11/2004, 14:48
| |||
| |||
| Mira esta pagina, creo que es lo que buscas.http://www.dannyg.com/examples/puzzle/mapgame.htm igual, si no te sirve ya trabajo en tu codigo |
|
10/11/2004, 12:11
| |||
| |||
| Hola Ramiro_olvera, he mirado la pagina y es mas o menos lo que quiero sólo que un poco mas currado y bonito y el mapa de fondo iria con todas las provincias silueteadas para que los niños las vayan poniendo en su sitio y para rizar el rizo si es posible cuando termine el puzzle un mensaje de en hora buena. El codigo que he puesto en el mensaje anterior es el de una pagina, si te impide ver bien el codigo, lo busco y te mando escuetamente el codigo. Gracias y un saludo. P.D. sabes si en el foro hay alguna opción de configurarlo para que te mande un aviso automatico al correo electronico cuando te han respondido en el foro??? |
|
13/11/2004, 16:00
| |||
| |||
| mira ya trabajo en el codigo pero esto te servira por lo pronto: <div style="background:transparent"></did> esto hace que la capa se vuelva transparente. si adentro de la capa le metes un gif con transparencia en la zona que no pertenezca a la parte de la provincia asunto arreglado. Lo unico que me falta, es detectar las coordenadas; para cuando ya esta completado te felicite 8-) pon el correo para mandarte el codigo fuente. Última edición por ramiro_olvera; 13/11/2004 a las 16:03 Razón: faltas de ortografia |
