Bueno, me acabo de ller las normas del Foro y no pone nada de que no pueda pegar aquí nada que sea extenso... así que ahi va....
<HTML>
<HEAD>
<style type="text/css">
#inicio{position: absolute; visibility:hidden; left:400px; top:250px; z-index:3;
background-color:#165480; border-width:4; color:#5FA6D7; border-style:ridge; border-color:#c0c0c0;
padding:10}
#finalB{position: absolute; visibility:hidden; left:700px; top:200px; z-index:3;
background-color:#ff9900; border-width:4; border-style:ridge; border-color:#c0c0c0;
padding:10}
#apuesta{position: absolute; visibility:hidden; left:120px; top:120px; z-index:3;
background-color:#ff9900; border-width:4; border-style:ridge; border-color:#c0c0c0;
padding:10}
#finalJ {position: absolute; visibility:hidden; left:10px; top:300px; z-index:3;
background-color:#ff9900; border-width:4; border-style:ridge; border-color:#c0c0c0;
padding:10}
</style>
<SCRIPT type="text/javascript">
var ie = (document.all)?true:false;
var ns6 = ((document.getElementById)?true:false) && !ie;
if(ie)//si es internet explorer el ancho y el alto se indican de esta manera
{
var ancho=document.body.clientWidth/2;
var alto=document.body.clientHeight/2;
}
if (ns6)//Si es Firefox el alto y el ancho se indican de esta manera
{
var ancho=window.innerWidth/2;
var alto=window.innerHeight/2;
}
function mostrar(nomcapa,text)//función que hace que se te muestra la capa
{
document.getElementById(nomcapa).innerHTML=text //MUESTRA EL TEXTO EN PANTALLA A TRAVÉS DE UNA CAPA
}//FINAL FUNCION
function capaON(pNomCapa)
{
document.getElementById(pNomCapa).style.visibility = 'visible';
}
function capaOFF(pNomCapa)
{
document.getElementById(pNomCapa).style.visibility = 'hidden';
}
function centraCapes(pNomCapa)
{
var anchocapa=document.getElementById(pNomCapa).offset Width/2;//guardo en una variable el ancho de la capa /2
var altocapa=document.getElementById(pNomCapa).offsetH eight/2;//guardo en una variable el alto de la capa /2
//alert("width : " + anchocapa + " px\nheight : " + altocapa + " px")
var result=ancho-anchocapa;//distancia entre el left y la capa
var resultado=alto-altocapa;//distancia entre el top y la capa
capaON(pNomCapa);
document.getElementById(pNomCapa).style.left = result;//la capa tiene como posición result
document.getElementById(pNomCapa).style.top = resultado;//la capa tiene como posición resultado
}
</script>
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#165480" >
<CENTER><H1><FONT color="#5FA6D7"> CARRERAS DE CANGREJOS</FONT></H1></CENTER>
<HR color="#5FA6D7">
<BR><BR><BR><BR>
<TABLE BORDER="1" ALIGN="CENTER" WIDTH="90%" HEIGHT="50%" BGCOLOR="#5FA6D7">
<TR WIDTH="200%">
<TD ><div id="menudes"> <img src="crancs/cranc0.gif"></div></TD>
</TR>
<TR>
<TD><div id="menudes"> <img src="crancs/cranc1.gif"></div></TD>
</TR>
<TR>
<TD><div id="menudes"> <img src="crancs/cranc2.gif"></div></TD>
</TR>
<TR>
<TD><div id="menudes"> <img src="crancs/cranc3.gif"></div></TD>
</TR>
<TR>
<TD><div id="menudes"> <img src="crancs/cranc4.gif"></div></TD>
</TR>
</TABLE>
<BR><BR><BR>
<TABLE BORDER="1" ALIGN="CENTER" WIDTH="80%" HEIGHT="15%" BGCOLOR="#5FA6D7">
<TR>
<TD ALIGN="CENTER" WIDTH="%20"><B><FONT size="5pt" color="#165480">SU DINERO</FONT></B></TD>
<TD ALIGN="CENTER" WIDTH="%20"><B><FONT size="5pt" color="#165480">BANCA</FONT></B></TD>
<TD ALIGN="CENTER" WIDTH="%20"><B><FONT size="5pt" color="#165480">SALIDA</FONT></B></TD>
<TD ALIGN="CENTER" WIDTH="%20"><B><FONT size="5pt" color="#165480">MENSAJES</FONT></B></TD>
</TR>
<TR>
<TD WIDTH="%20"> <div align="center" id="capadinero"></div> </TD>
<TD WIDTH="%20"> <div align="center" id="capabanca"></TD>
<TD WIDTH="%20"> <div align="center" id="capasemáforo"></TD>
<TD WIDTH="%20" ALIGN="CENTER"> <FORM><INPUT TYPE="BUTTON" VALUE="Empezar Partida"
style="background-color:#165480;font-size:12pt;color:#5FA6D7; font-weight: bold;" onclick="capaON('inicio');centraCapes('inicio')"></FORM></TD>
</TR>
</TABLE>
<form>
<span id="finalJ">
<h1>Partida finalizada</h1>
<h2 align="center">Usted pierde</h2>
</span>
<span id="finalB">
<h1>Partida acabada</h1>
<h2 align="center">Usted ha Ganado</h2>
</span>
<span id="inicio">
<table cellspacing="5" cellpadding="0">
<tr>
<td colspan="2"><B>Con cuanto dinero quieres
<br>empezar la partida?</B></td>
</tr>
<tr>
<td align="center"><input type="text" maxlength="6" size="6" name="entrada"></td>
<td align="center"><input type="button" value="Ok"></td>
</tr>
</table>
</span>
<span id="apuesta">
<table cellspacing="5" cellpadding="0">
<tr>
<td colspan="3" align="right"><b>Cantidad:</b></td>
<td colspan="3"><input type="text" maxlength="6" size="6" name="quant"></td>
</tr>
<tr>
<th colspan="6">Apuesta por:</th>
</tr>
<tr>
<td><input type="radio" value="0" name="qcranc"></td><td><img src="images/cranc0.gif"></td>
<td><input type="radio" value="1" name="qcranc"></td><td><img src="images/cranc1.gif"></td>
<td><input type="radio" value="2" name="qcranc"></td><td><img src="images/cranc2.gif"></td>
</tr>
<tr>
<td><input type="radio" value="3" name="qcranc"></td><td><img src="images/cranc3.gif"></td>
<td><input type="radio" value="4" name="qcranc"></td><td><img src="images/cranc4.gif"></td>
<td colspan="2" align="right"><input type="button" value="Ok"></td>
</tr>
</table>
</span>
</form>
</BODY>
</HTML>
Si quieres puedes ejecutarlo para que lo veas mejor....
Muchas gracias
Saludos!!! y felices Fiestas.