Foros del Web » Programando para Internet » Javascript » Frameworks JS »

[SOLUCIONADO] Contenido desplegable

Estas en el tema de Contenido desplegable en el foro de Frameworks JS en Foros del Web. Hola, tengo un bucle que me produce una lista de items, todos con los mismos atributos, y estoy intentando que, en cada item, salga el ...
  #1 (permalink)  
Antiguo 04/09/2013, 17:04
 
Fecha de Ingreso: mayo-2012
Mensajes: 25
Antigüedad: 12 años, 6 meses
Puntos: 1
Contenido desplegable

Hola, tengo un bucle que me produce una lista de items, todos con los mismos atributos, y estoy intentando que, en cada item, salga el titulo pero el contenido de cada uno se despliegue al hacer click en un botón, pero claro, como el div del contenido se llama igual en todos los elementos del bucle, se me despliegan todos..

Por si no me he explicado bien, sería una lista de tratamientos y saldrían todos con su imagen y su titulo, y un botón de + para desplegar toda la información.

Dentro del bucle tengo:

Código:
<div class="item">
       <?php the_post_thumbnail('medium'); ?>
       <h3 class="title"><?php the_title(); ?></h3>
       <?php the_excerpt(); ?>
       <div class="more">
	
		<div class="icon-plus"></div>
		<div class="icon-minus" style="display:none;"></div>	
		
	</div>
	<div class="content"><?php the_content(); ?></div>
</div>
Y el javascript:

Código:
$('.more').click(function() {
		$('#treatments .content').slideToggle('slow', function() {
			$(".icon-plus").toggle(); 
			$(".icon-minus").toggle();
		});
	});
Y claro, se me despliega el contenido de todos los tratamientos..

Alguien sabe como puedo solucionarlo??

Muchas graciaaas!!!!
  #2 (permalink)  
Antiguo 04/09/2013, 23:59
Avatar de Trublux  
Fecha de Ingreso: octubre-2010
Ubicación: Madrid
Mensajes: 355
Antigüedad: 14 años, 1 mes
Puntos: 48
Respuesta: Contenido desplegable

Puedes seguir lanzando el evento cuando hacen click en ".more" y en esta, usar $(this) para coger los hijos (".icon-plus" e ".icon-minus").
No sé de donde sale "'#treatments .content".
__________________
eZ Publish Developer Basic Legacy
eZ Publish Developer Basics (4.4)
Alojamientos rurales en España
  #3 (permalink)  
Antiguo 05/09/2013, 11:16
 
Fecha de Ingreso: mayo-2012
Mensajes: 25
Antigüedad: 12 años, 6 meses
Puntos: 1
Respuesta: Contenido desplegable

Muchas gracias, si era lo que decias.
Por si a alguien le interesa se me ha quedado así:

Código:
<div class="item">
	<?php the_post_thumbnail('medium'); ?>
	<h3 class="title"><?php the_title(); ?></h3>
	<?php the_excerpt(); ?>
	<div class="more">
		<div class="open"><span class="button button_small button_green">Leer m&aacute;s</span></div>
		<div class="close" style="display:none;"><span class="button button_small button_green">Ocultar</span></div>	
		<div class="content"><?php the_content(); ?></div>
	</div>
</div>


$('.more').click(function() {
	$(this).children('.open').toggle();
	$(this).children('.close').toggle();
	var content = $(this).children('.content');
	content.toggle();
});

Etiquetas: contenido, desplegable, javascript, php
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 14:21.