Wenas,
Toy con una pagina web, y voy sobre la marcha programandola. Una de las cosas que estoy intentando es la de ocultar, mostar capas.
Es algo igualito a lo de marca, pero el unico problema que tengo son.
1 que tengo repeticiones de codigo, sobre todo en javascritp, como evitarlo?
2, que cuando se entra en el dreamweaver, la capa esta desplazada de su sitio, pero en el navegador, se ve bien, y funciona correctamente.
Aqui el codigo.
Código HTML:
#bordeA{ border-right:2px solid #000000;
border-bottom: 2px solid #000000;
padding:5px;
}
#bordeB{ border-bottom: 2px solid #000000;
padding: 5px;
}
#bordeC{ border-right:2px solid #000000;
padding: 5px;
}
#bordeD{ padding: 5px;
}
.bordemarcado{ font-weight: bold;
color: #FF0000;
}
.sepatxt{ font-size: 12px;}
#agendanotis
{
position:relative;
background-color:#F2EFD6;
width: 242px;
height: 260px;
}
.capaprin{
visibility:visible;
position:absolute;
width:98%;
}
.capaocul{
visibility:hidden;
position:absolute;
width:98%;
}
Código HTML:
<div id="agendanotis">
<div id="capa1" class="capaprin">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="sepatxt">
<tr>
<td width="28%" valign="middle" id="bordeA">11/09/2009 </td>
<td width="72%" align="left" valign="top" id="bordeB">Impos</td>
</tr>
<tr>
<td valign="middle" id="bordeA">12/09/2009 </td>
<td align="left" valign="top" id="bordeB">Impo</td>
</tr>
<tr>
<td valign="middle" id="bordeA">19/09/2009 </td>
<td align="left" valign="top" id="bordeB">Prese</td>
</tr>
<tr>
<td valign="middle" id="bordeA">26/09/2009 </td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">03/10/2009</td>
<td align="left" valign="top" id="bordeB">Pre</td>
</tr>
<tr>
<td valign="middle" id="bordeA">10/10/2009</td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">17/10/2009</td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeA">24/10/2009</td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeC">31/10/2009</td>
<td align="left" valign="top" id="bordeD">P</td>
</tr>
</table>
</div>
<!-- Fin Capa 1, Inicio Capa 2-->
<div id="capa2" class="capaocul">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="sepatxt">
<tr>
<td width="28%" valign="middle" id="bordeA">06/11/2009</td>
<td width="72%" align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">07/11/2009</td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">14/11/2009</td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">21/11/2009 </td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">28/11/2009</td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeA">05/12/2009 </td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeA">12/12/2009 </td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeA">19/12/2009</td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeC">09/01/2010</td>
<td align="left" valign="top" id="bordeD">P</td>
</tr>
</table>
</div>
<!--Fin capa 2, inicio Capa 3 -->
<div id="capa3" class="capaocul">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="sepatxt">
<tr>
<td width="28%" valign="middle" id="bordeA">16/01/2010</td>
<td width="72%" align="left" valign="top" id="bordeB">Pre</td>
</tr>
<tr>
<td valign="middle" id="bordeA">21/01/2010</td>
<td align="left" valign="top" id="bordeB">En</td>
</tr>
<tr class="bordemarcado">
<td valign="middle" id="bordeA">23/01/2010</td>
<td align="left" valign="top" id="bordeB">Presentación Gaiata 13</td>
</tr>
<tr>
<td valign="middle" id="bordeA">30/01/2010</td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">06/02/2010</td>
<td align="left" valign="top" id="bordeB">P</td>
</tr>
<tr>
<td valign="middle" id="bordeA">13/02/2010</td>
<td align="left" valign="top" id="bordeB">Pr</td>
</tr>
<tr>
<td valign="middle" id="bordeA">17/02/2010?</td>
<td align="left" valign="top" id="bordeB">E</td>
</tr>
<tr>
<td valign="middle" id="bordeC">20/02/2010</td>
<td align="left" valign="top" id="bordeD">Hom</td>
</tr>
</table>
</div>
<!-- Fin capa 3, Inicio capa 4-->
<div id="capa4" class="capaocul">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="sepatxt">
<tr>
<td width="28%" valign="middle" id="bordeA">21/02/2010</td>
<td width="72%" align="left" valign="top" id="bordeB">Hom</td>
</tr>
<tr>
<td valign="middle" id="bordeA">24/01/2010?</td>
<td align="left" valign="top" id="bordeB">En</td>
</tr>
<tr>
<td valign="middle" id="bordeA">27/02/2010</td>
<td align="left" valign="top" id="bordeB">Ga</td>
</tr>
<tr>
<td valign="middle" id="bordeA">28/02/2010</td>
<td align="left" valign="top" id="bordeB">Gal</td>
</tr>
<tr>
<td valign="middle" id="bordeC">06/02/2010</td>
<td align="left" valign="top" id="bordeD">In</td>
</tr>
<tr>
<td id="bordeD"> </td>
<td id="bordeD"> </td>
</tr>
<tr>
<td id="bordeD"> </td>
<td id="bordeD"> </td>
</tr>
<tr>
<td id="bordeD"> </td>
<td id="bordeD"> </td>
</tr>
<tr>
<td id="bordeD"> </td>
<td id="bordeD"> </td>
</tr>
</table>
</div>
</div>
</td>
<td width="6%"> </td>
</tr>
</table></td>
</tr>
<tr>
<td background="img/sub_menu3.PNG">
<table width="99%" border="0" cellspacing="0" cellpadding="0" class="sepatxt">
<tr>
<td width="95%">
<!-- Sacan las capas, numeraciones -->
<div align="right"><a href="#" onclick="muestra1()" class="bordemarcado">1</a> - <a href="#" onclick="muestra2()">2</a> - <a href="#" onclick="muestra3()">3</a> - <a href="#" onclick="muestra4()">4</a></div>
</td>