Ayuda en texto para que se quede activo

[aruizroldan]

Hola a todos. Tengo hecho en css y javascript una pagina para mostrar y ocultar capas. La función javascript es :

Código PHP:

  <script> 
capaActual = "primera"; 
function esActivo(elemento)    { 
    return; 
} 
 
function selecciona(elemento)    { 
    if (elemento.split("_")[1] == capaActual)    esActivo(elemento); 
    else    { 
        document.getElementById("pesta_" + capaActual).className = "pesta inactiva"; 
        document.getElementById("capa_" + capaActual).className = "capa invisible"; 
        capaActual = elemento.split("_")[1]; 
        document.getElementById("pesta_" + capaActual).className = "pesta activa"; 
        document.getElementById("capa_" + capaActual).className = "capa visible"; 
    } 
} 
 
function alturaContenido()    { 
    var altura = document.body.offsetHeight; 
    var alturaPestas = document.getElementById("pestas").offsetTop; 
    var tamPestas = document.getElementById("pestas").offsetHeight; 
    document.getElementById("contenido").style.height = (altura - (alturaPestas + tamPestas)) + "px"; 
} 
</script>  
  

La web desde donde se llama es :

Código PHP:

  <table width="33%" border="0"> 
  <tr> 
    <td width="31%" valign="top"> 
    <table width="91%" border="0" style="text-align:left;"> 
      <tr> 
        <td height="20"> 
        <span class="pesta activa" id="pesta_primera" onClick="selecciona(this.id)"></span> 
        <span class="pesta inactiva" id="pesta_uno" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 1</a> 
            </span> 
         
        </td> 
      </tr> 
      <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_dos" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 2</a> 
            </span></td> 
      </tr> 
      <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_tres" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 3</a> 
            </span></td> 
      </tr> 
       <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_cuatro" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 4</a> 
            </span></td> 
      </tr> 
      <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_cinco" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 5</a> 
            </span></td> 
      </tr> 
       <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_seis" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 6</a> 
            </span></td> 
      </tr> 
      <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_siete" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 7</a> 
            </span></td> 
      </tr> 
       <tr> 
        <td height="20"><span class="pesta inactiva" id="pesta_ocho" onClick="selecciona(this.id)"> 
            <a href="#" class="ddbullet">MENÚ 8</a> 
            </span></td> 
      </tr> 
      </table></td> 
    <td width="69%" valign="top" align="left"> 
    <table height="5px"><tr><td></td></tr></table> 
    <div id="contenido" class="activa"> 
<div class="capa visible" id="capa_primera"></div> 
<div class="capa invisible" id="capa_uno"> 
<strong>Entrantes</strong> 
<br />Selección de canapés 
<br /> 
Croquetas caseras de jamón 
<br /> 
Rollitos de berenjena 
<br /> 
Tartaletas de habitas y pisto 
<br /> 
Bolitas de flamenquín 
<br /> 
Pescaito frito 
<br /> 
<br /> 
<strong>Menú</strong> 
<br />Jamón Ibérico 
<br /> 
Queso añejo 
<br /> 
  
 
Centro de merluza en marinera 
<br /> 
Sorbete de limón 
<br /> 
Solomillo de cerdo Doña Aldonza 
<br /> 
 
 Tarta Nupcial  
<br /> 
Helado 
<br /> 
<br /> 
<strong> Bodega</strong> 
<br /> 
Fino D. O. Montilla-Moriles 
<br /> 
Tinto Rioja Crianza de la casa 
<br /> 
Cerveza, refrescos 
<br /> 
Agua mineral  
<br /> 
Cava 
</div> 
<div class="capa invisible" id="capa_dos"> 
Huevos fritos con chorizo casero 
<br>Huevos a la flamenca 
<br>Revuelto de espárragos 
<br>Revuelto de setas con gambas 
 
</div> 
<div class="capa invisible" id="capa_tres"> 
Espárragos de Aranjuez a dos salsas 
<br>Judías con jamón 
<br>Habas con jamón 
 
</div> 
<div class="capa invisible" id="capa_cuatro"> 
Merluza a la Vasca 
<br>Gambas cocidas al ajillo 
<br>Pulpo a la Gallega 
<br>Pez espada a la naranja 
<br>Merluza cocida 
 
</div> 
<div class="capa invisible" id="capa_cinco"> 
Entrecot <em>Maitre de hotel</em> 
<br>Ternera al Jerez 
<br>Callos a la Andaluza 
<br>Rabo de toro 
<br>Chuletón de ternera 
<br>Presa Ibérica 
 
</div> 
<div class="capa invisible" id="capa_seis"> 
Presa ibérica 
<br>Carne de monte  
<br>Solomillo de cerdo a la pimienta 
<br>Flamenquin casero 
<br>Pollo al ajillo 
 
</div> 
 
<div class="capa invisible" id="capa_siete"> 
Presa ibérica 
<br>Carne de monte  
<br>Solomillo de cerdo a la pimienta 
<br>Flamenquin casero 
<br>Pollo al ajillo 
 
</div> 
 
<div class="capa invisible" id="capa_ocho"> 
Presa ibérica 
<br>Carne de monte  
<br>Solomillo de cerdo a la pimienta 
<br>Flamenquin casero 
<br>Pollo al ajillo 
 
</div> 
 
</div> 
     
    </td> 
  </tr> 
</table>  
   

Y la hoja de estilos es :

Código PHP:

  #pestas    { 
    margin: 0px; 
    padding: 0px; 
} 
 
#contenido    { 
    margin: 0px; 
    padding: 0px; 
    border: 0px inset gray; 
    border-top: 0px; 
    overflow: auto;     
} 
 
.pesta    { 
    border: 0px inset gray; 
    margin: 0px; 
    padding: 0px 0px; 
    border-bottom: 0px; 
} 
 
.activa    { 
     
    cursor: pointer; 
} 
 
.inactiva    { 
     
    cursor: pointer; 
} 
 
.capa    { 
    overflow: auto; 
} 
 
.visible    { 
    display: block; 
    font-family: "Arial";  
    font-size        : 11px; 
    color            : #76787B; 
} 
 
.visibledos    { 
    display: block; 
    font-family: "Verdana";  
    font-size        : 12px; 
    color            : #B2AB8C; 
} 
 
.invisible    { 
    display: none; 
}  
   

Bien, lo que hace la web es que pinchando en las capas pesta cambien las capas llamadas capas (ejemplo capa_uno). Lo que quiero es que al pinchar sobre pesta esta se quede en negro. ¿es posible?

Gracias.

[webosiris]

no veo ninguna "capa pesta"... lo que veo es un span, y una <mod irónico on> preciosa <mod irónico off> tabla...
ahora, sin estudiar mucho el código no estoy seguro que funcione, pero podés probar esto (agregá lo que está en rojo):

Código:

.activa { 
background:#000;
cursor: pointer;}