Foros del Web » Programando para Internet » Javascript »

Como hacer un fadeIn solo al primer div dentro de otro

Estas en el tema de Como hacer un fadeIn solo al primer div dentro de otro en el foro de Javascript en Foros del Web. Amigos lo que necesito hacer es al precionar un boton se haga un fadeIn de un Div y que a la ves se haga un ...
  #1 (permalink)  
Antiguo 26/03/2013, 14:03
Avatar de xalupeao  
Fecha de Ingreso: mayo-2008
Ubicación: Santiago, Chile
Mensajes: 749
Antigüedad: 16 años, 6 meses
Puntos: 12
Como hacer un fadeIn solo al primer div dentro de otro

Amigos lo que necesito hacer es al precionar un boton se haga un fadeIn de un Div y que a la ves se haga un show o fadeIn del primer div con class "bloque"

Código HTML:
Ver original
  1. <article id="categoria_uno">
  2.     <div class="bloque" id="bloque_1" style="display:none"></div>
  3.     <div class="bloque" id="bloque_2" style="display:none"></div>
  4. <article id="categoria_dos" style="display:none">
  5.     <div class="bloque" id="bloque_3" style="display:none"></div>
  6.     <div class="bloque" id="bloque_4" style="display:none"></div>
  7.  
  8. <input type="button" id="mostrar" name="mostrar" value="Mostrar Categoria dos" />

Código Javascript:
Ver original
  1. $('#mostrar').click(function(){
  2.     $('#categoria_dos').fadeIn();
  3.     //como lo puedo hacer aqui para que me muestre el "bloque_3", pensando en que este id puede ser variable.
  4. });
__________________
Hosting en Chile en Silverhost - La solución en Hosting en Chile.
  #2 (permalink)  
Antiguo 26/03/2013, 15:04
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 5 meses
Puntos: 1567
Respuesta: Como hacer un fadeIn solo al primer div dentro de otro

Tu ejemplo es confuso
imagina esto

Código:
<article id="categoria_uno">
    <div class="bloque" id="bloque_1" style="display:none">a</div>
    <div class="bloque" id="bloque_2" style="display:none">b</div>
</article>
<article id="categoria_dos" style="display:none">
    <div class="bloque" id="bloque_3" style="display:none">c</div>
    <div class="bloque" id="bloque_4" style="display:none">d</div>
</article>
Por un lado decís
Cita:
que a la ves se haga un show o fadeIn del primer div con class "bloque"
Eso representa el div con contenido a
pero por otro lado decís
Cita:
//como lo puedo hacer aqui para que me muestre el "bloque_3", pensando en que este id puede ser variable.
que es el que tiene por contenido c

No me queda claro, por lo pronto el primer bloque en el div categoria_uno lo podés identificar con
Cita:
$('#categoria_dos .bloque:first');
Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #3 (permalink)  
Antiguo 26/03/2013, 15:06
Avatar de ipraetoriux  
Fecha de Ingreso: abril-2010
Ubicación: ipraetoriux.com
Mensajes: 1.125
Antigüedad: 14 años, 7 meses
Puntos: 155
Respuesta: Como hacer un fadeIn solo al primer div dentro de otro

...pues tendría que ser algo así...para que sea variable, tendrías que hacer una función al presionar el botón, y enviar como argumento que bloque en particular quieres mostrar...

Código Javascript:
Ver original
  1. $('#mostrar').click(function(){
  2.     $('#categoria_dos').fadeIn("fast", function(){
  3.      $("#categoria_dos div:first").fadeIn();
  4. });
  5.    
  6. });

Etiquetas: fadein, input, primer
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 18:48.