les dejo los codigos. para que revisen por donde voy:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Language" content="es" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Sin título 1</title> <style type="text/css"> .style1 { border-style: solid; background-image: url('bk1.jpg'); } .style2 { color: #FF0000; } .style3 { text-align: center; } </style> </head> <body> <table style="width: 1024px; height: 768px" class="style1"> <tr> <td > <label name="img" style="position: absolute; width: 277px; height: 331px; z-index: 2; left: 721px; top: 57px" id="img" class="style2"> </label> <div style="position: absolute; width: 574px; height: 421px; z-index: 1; left: 61px; top: 72px" id="capa1" class="style3"> <p align="center" style="margin-top: 8px; margin-bottom: 3px"><i><b> <font color="#FF0000">CREAR PERSONAJE</font></b></i></p> <form name="form1" method="post" action="ser.php"> <div style="position: absolute; width: 402px; height: 325px; z-index: 1; left: 18px; top: 40px" id="capa1" align="center"> <table cellpadding="0" cellspacing="0" height="30" width="525" id="table1"> <tr> <td height="30" width="87"><font color="#FF0000">Nombre:</font></td> <td height="30" width="438"> <label> <input name="namepj" id="namepj" size="37" style="float: left"> </label> </td> </tr> <tr> <td height="30" width="87"><font color="#FF0000">Raza:</font></td> <td height="30" width="438"> <p align="left"> <label> <select name="raza" size="1" type="text" id="raza" onChange="redirect(this.options.selectedIndex)"> <option selected>--Escoja una Raza--</option> <option value="humano">Humano</option> <option value="argonautas">Argonauta</option> <option value="enano">Enano</option> <option value="arunos">Arunos (Elfo)</option> </select> </label> </td> </tr> <tr> <td height="30" width="87"><font color="#FF0000">Profesión:</font></td> <td height="30" width="438"> <p align="left"> <label> <select name="prof" size="1" type="text" id="prof"> <option value=" " selected> </option> <option value=" " selected>Prof. Humanos</option> <option value=" " selected>Prof. Argonautas</option> <option value=" " selected>Prof. Enanos</option> <option value=" " selected>Prof. Arunos</option> </select> </label> </td> </tr> <tr> <td height="30" width="87"><font color="#FF0000">Sexo:</font></td> <td height="30" width="438"> <p align="left"> <label> <select name="sexo" size="1" type="text" id="sexo"> <option value="m">Masculino</option> <option value="f">Femenino</option> </select> </label> </td> </tr> <tr> <td height="30" width="87"><font color="#FF0000">Edad:</font></td> <td height="30" width="438"> <p align="left"> <label> <select name="edad" size="1" type="text" id="edad"> <option value="10">10 años</option> <option value="20">20 años</option> <option value="35">35 años</option> <option value="45">45 años</option> <option value="55">55 años</option> <option value="65">65 años</option> <option value="75">75 años</option> <option value="85">85 años</option> <option value="95">95 años</option> <option value="105">105 años</option> <option value="120">120 años</option> </select> </label> </td> </tr> <tr> <td height="30" width="87"><font color="#FF0000">Apariencia:</font></td> <td height="60" width="438" rowspan="2"> <p align="left"> <label> <textarea name=apa type="text" ROWS=7 COLS=50 id="apa" size="41">Descrive la apariencia fisica del personaje </textarea> </label> </td> </tr> <tr> <td height="30" width="87"> </td> </tr> </table> <p align="center"> <label> <input type="submit" name="Submit" value="Continuar con la Creación"> <script> var groups=document.form1.raza.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[0][0]=new Option("Escoja una Profecion"," "); group[1][0]=new Option("Selecione una Profeción"," "); group[1][1]=new Option("Guerrero","guerrero"); group[1][2]=new Option("Paladin(Caballero)","paladin"); group[1][3]=new Option("Mercenario(Asesino)","mercenario"); group[1][4]=new Option("Sacerdote","sacerdote"); group[1][5]=new Option("Mago","mago"); group[1][6]=new Option("Brujo","brujo"); group[2][0]=new Option("Selecione una Profeción"," "); group[2][1]=new Option("Paladin(Caballero)","paladin"); group[2][2]=new Option("Mago","mago"); group[2][3]=new Option("Sacerdote","sacerdote"); group[3][0]=new Option("Selecione una Profeción"," "); group[3][1]=new Option("Guerrero","guerrero"); group[3][2]=new Option("Paladin(Caballero)","paladin"); group[3][3]=new Option("Cazador","cazador"); group[4][0]=new Option("Selecione una Profeción"," "); group[4][1]=new Option("Guerrero","guerrero"); group[4][2]=new Option("Paladin(Caballero)","paladin"); group[4][3]=new Option("Mago","mago"); group[4][4]=new Option("Sacerdote","sacerdotes"); var temp=document.form1.prof function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<group[x].length;i++){ temp.options[i]=new Option(group[x][i].text,group[x][i].value) } temp.options[0].selected=true } </script> </label> </p> </div> </form> </div> <div style="position: absolute; width: 315px; height: 240px; z-index: 1; left: 39px; top: 515px" id="capa4" class="style2"> <iframe id="marco" width="315" height="240" src="inf.html"> </iframe> </div> <div style="position: absolute; width: 240px; height: 240px; z-index: 1; left: 764px; top: 515px" id="capa5" class="style2"> lol2 </div> <div style="position: absolute; width: 315px; height: 240px; z-index: 1; left: 404px; top: 515px" id="capa6" class="style2"> lol3 </div> </td> </tr> </table> </body> </html>