Ya perdi la cabeza tratando de solucionar el siguiente problema:l
Hice un cuadro con titulos a los cuales se les puede mostrar y ocultar el contenido, pero tengo un problema... De partida todos los cuadros estan cerrados menos el primero... que debe aparecer abierto... pero la primera vez que se le hace click a los cuadros sale un slideUp en vez de un slideDown... pero despues se arregla... es solo la primera vez la que me trae problemas... les dejo la pagina para ver si me pueden ayudar... TAMBIEN QUIERO DECIRLES que hice una especie de "lazo" por medio del link... en el cual por ejemplo, si ingreso la direccion: http://mipagina.com/jquerySlide.html#servicios al meterse a esa direccion el cuadro servicios se expande... lo mismo si coloco al final del link #equipo...
Vean la pagina, pruebenla y se daran cuenta del problema... vean el codigo de fuente...
Muchas gracias y espero que me puedan ayudar.
http://diegoulloa.homelinux.com/jquery/mostrar-ocultar.html
CODIGO:
Código HTML:
<html>
<head>
<script src = "JQuery.js" type = "text/javascript"></script>
<style type = "text/css">
a:link {
color : #CCCCCC;
text-decoration : none;
}
a:hover {
color : white;
}
a:visited {
color : #CCCCCC;
text-decoration : none;
}
a:visited:hover {
color : white;
text-decoration : none;
}
.visibleDiv {
width : auto;
height : auto;
background : black;
font-family : Verdana;
font-size : 12px;
color : white;
text-align : center;
padding : 15px;
}
.title {
font-family : Verdana;
font-size : 16px;
font-weight : bold;
color : white;
background : #222222;
width : auto;
height : auto;
}
.hiddenDiv {
overflow : hidden;
width : 0;
height : 0;
}
</style>
<script language = "JavaScript" type = "text/javascript">
//METODOS:
function itemsToggle(divID) {
divIDf = new String(divID + ":first");
$(document.body).ready(function () {
if ($(divIDf).is(":hidden")) {
$(divID).removeClass("hiddenDiv");
$(divID).addClass("visibleDiv");
$(divID).slideDown("slow");
} else {
$(divID).removeClass("hiddenDiv");
$(divID).addClass("visibleDiv");
$(divID).slideUp("slow");
}
});
}
function linkAction(id) { //check
$(document).ready(function() {
$(id).removeClass("hiddenDiv");
$(id).addClass("visibleDiv");
$(id).slideDown("slow");
});
}
function getLinkID() { //check
var dir = location.href;
var idSymbolPos = dir.indexOf("#");
var idLarge = dir.length;
var ID = dir.substring(idSymbolPos, idLarge);
return ID;
}
//_______________________________________________________________________________________
var idException = getLinkID();
if(location.href.indexOf("#") != -1) {
linkAction(idException);
count++;
}
</script>
</head>
<body>
<div name = "meta" class = "title">
<a href = "#" onClick = "JavaScript: itemsToggle('#meta');">1. META COMO EMPRESA</a>
</div> <!-- /titulo -->
<div id = "meta" class = "visibleDiv">
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
</div> <!-- /cuadro -->
<div name = "servicios" class = "title">
<a href = "#" onClick = "JavaScript: itemsToggle('#servicios');">2. SERVICIOS</a>
</div> <!-- /titulo -->
<div id = "servicios" class = "hiddenDiv">
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
</div> <!-- /cuadro -->
<div name = "testimonio" class = "title">
<a href = "#" onClick = "JavaScript: itemsToggle('#testimonios');">3. TESTIMONIOS</a>
</div> <!-- /titulo -->
<div id = "testimonios" class = "hiddenDiv">
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
</div> <!-- /cuadro -->
<div name = "equipo" class = "title">
<a href = "#" onClick = "JavaScript: itemsToggle('#equipo');">4. EQUIPO</a>
</div> <!-- /titulo -->
<div id = "equipo" class = "hiddenDiv">
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
Texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
texto texto texto texto texto texto texto texto texto texto texto texto texto
</div> <!-- /cuadro -->
</body>
</html>