Ver Mensaje Individual
  #1 (permalink)  
Antiguo 03/10/2011, 19:00
hakender
 
Fecha de Ingreso: octubre-2010
Mensajes: 12
Antigüedad: 13 años, 6 meses
Puntos: 0
Pestaña activa en menú

Hola a todos! Estoy haciendo un menú de pestañas con HTML, CSS y JavaScript.

Tengo este HTML:


<ul class="tabmenu">
<li><a href="javascript:void(0)" onclick="tabs('1');changeActiveStates(this)" id="link1">Informaci&oacute;n</a></li>
<li><a href="javascript:void(0)" onclick="tabs('2');changeActiveStates(this)" id="link2">Mapas</a></li>
<li><a href="javascript:void(0)" onclick="tabs('3');changeActiveStates(this)" id="link3">Fotos</a></li>
<li><a href="javascript:void(0)" onclick="tabs('4');changeActiveStates(this)" id="link4">C&oacute;mo llegar</a></li>
</ul>


A esto le agregué un poco de CSS para el estilo y las siguientes líneas en javascript:


<script type="text/javascript">
function tbs(id){
return document.getElementById(id);
}

function tabsen(){
tbs("1").style.display = "none";
tbs("2").style.display = "";
tbs("3").style.display = "";
tbs("4").style.display = "";
}

function tabs(id) {
tabsen();
var e = tbs(id);
e.style.display = ( e.style.display == '' ) ? 'block' : '' ;
}

function byId(id) {
return document.getElementById ? document.getElementById(id) : document.all[id];
}
var prevLink = "";
function changeActiveStates(ele) {
if (prevLink) byId(prevLink).className = "";
ele.className = 'active';
prevLink = ele.id;
}
</script>


El problema es que no sé cómo hacer para que la primera pestaña aparezca activa al abrirse la página. Ya probé con ponerle class='active', pero aunque así aparece activa, al clickear sobre otra pestaña la primera no se desactiva. Solamente al cliquear sobre la primera y después sobre otra ahí sí se desactiva.

Alguien puede ayudarme? :S