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;}