Foros del Web » Programando para Internet » Jquery »

[SOLUCIONADO] Mostrar y ocultar capa con jQuery

Estas en el tema de Mostrar y ocultar capa con jQuery en el foro de Jquery en Foros del Web. Buenas, sigo probando un desplegable que se abre o cierra al pulsar un elemento. Está realizado con jQuery, el problema está en que sale abierto ...
  #1 (permalink)  
Antiguo 04/11/2014, 02:18
El_Astur
Invitado
 
Mensajes: n/a
Puntos:
Mostrar y ocultar capa con jQuery

Buenas,

sigo probando un desplegable que se abre o cierra al pulsar un elemento. Está realizado con jQuery, el problema está en que sale abierto por defecto, es decir, en vez de abrir la capa oculta cuando se pulsa sale abierta ya en cuanto se abre el archivo. ¿Puede ser quizás por conflicto con otros scripts? He probado a utilizar el jQuery no conflict pero sigue igual, quizás no lo haya utilizado bien. Dejo los scripts que tengo en un archivo externo por si alguien puede saber a qué se debe el problema:

//Menú desplegable acordeón

$(document).ready(function(){
$('#faq').simpleAccordion({
header: "dt",
collapsable: "dd",
speed: "slow"
});
});

//Desplegable al pulsar botón: edit, view

$(document).ready(function(){
$(".botonoculta").click(function () {
$(".divoculta").each(function() {
displaying = $(this).css("display");
if(displaying == "block") {
$(this).fadeOut('slow',function() {
$(this).css("display","none");
});
} else {
$(this).fadeIn('slow',function() {
$(this).css("display","block");
});
}
});
});
});


//Selectbox en formulario

$(function () {
$(".privilege").selectbox();
$(".companies").selectbox();
});

//Desplegable al pulsar botón: add note, add contact

$(document).ready(function(){
$(".botonocult").click(function () {
$(".divocult").each(function() {
displaying = $(this).css("display");
if(displaying == "block") {
$(this).fadeOut('slow',function() {
$(this).css("display","none");
});
} else {
$(this).fadeIn('slow',function() {
$(this).css("display","block");
});
}
});
});
});

// Tabs - navegación por pestañas

$(document).ready(function() {
$("#content div").hide();
$("#tabs li:first").attr("id","current");
$("#content div:first").fadeIn();

$('#tabs a').click(function(e) {
e.preventDefault();
$("#content div").hide();
$("#tabs li").attr("id","");
$(this).parent().attr("id","current");
$('#' + $(this).attr('title')).fadeIn();
});
})();


Html

<button class="botonocult clase" type="button">Abrir</button>
<!--abre capa-->
<div class="divocult">
contenido oculto
</div>


Un saludo
  #2 (permalink)  
Antiguo 05/11/2014, 11:56
 
Fecha de Ingreso: abril-2013
Mensajes: 60
Antigüedad: 11 años, 8 meses
Puntos: 2
Respuesta: Mostrar y ocultar capa con jQuery

$(".botonocult").on("click",function(){
$(".divocult").slideToggle();
});
  #3 (permalink)  
Antiguo 13/11/2014, 09:07
El_Astur
Invitado
 
Mensajes: n/a
Puntos:
Respuesta: Mostrar y ocultar capa con jQuery

Gracias Marcelo, dejo la función por si a alguien le puede servir o ayudar. A mi me ha funcionado:

$(document).ready(function(){
$(".botonoculta").click(function () {
$(".divoculta").each(function() {
displaying = $(this).css("display");
if(displaying == "block") {
$(this).fadeOut('slow',function() {
$(this).css("display","none");
});
} else {
$(this).fadeIn('slow',function() {
$(this).css("display","block");
});
}
});
});
});

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 07:02.