Foros del Web » Programando para Internet » Jquery »

.hover en diferentes filas

Estas en el tema de .hover en diferentes filas en el foro de Jquery en Foros del Web. Hola: Voy usando fadeToggle() para mostrar y ocultar un emergente, pero solo me funciona en el primer registro y no en el resto tengo algo ...
  #1 (permalink)  
Antiguo 24/06/2013, 17:16
 
Fecha de Ingreso: enero-2010
Mensajes: 491
Antigüedad: 14 años, 3 meses
Puntos: 12
.hover en diferentes filas

Hola:

Voy usando fadeToggle() para mostrar y ocultar un emergente, pero solo me funciona en el primer registro y no en el resto tengo algo asi;
Código PHP:
<tr>
<td><div id='cite'><?php echo $lista['cite']; ?>
<div id="emerg" style="background:#fff;display:none;width:150px;height:50px;border:1px solid #555;clear: left;float:inherit;position:absolute;">Hola que tal</div>
</tr>
<tr>
<td><div id='cite'><?php echo $lista['cite']; ?>
<div id="emerg" style="background:#fff;display:none;width:150px;height:50px;border:1px solid #555;clear: left;float:inherit;position:absolute;">Hola que tal</div>
</tr>
y al final tengo:

Código Javascript:
Ver original
  1. $(function() {
  2.     $("#cite").hover(function(){
  3.         $("#emerg").fadeToggle();
  4.     });
  5. });
recalco solo me funciona para el primer registro, como haría para que me funcionara para todos los registros
  #2 (permalink)  
Antiguo 25/06/2013, 05:04
Avatar de Lobito14  
Fecha de Ingreso: abril-2010
Mensajes: 222
Antigüedad: 14 años
Puntos: 17
Respuesta: .hover en diferentes filas

Yo usaría clases en vez de id.

Las ids deberían ser únicas y no repetirse entre varios elementos.

Saludos.
  #3 (permalink)  
Antiguo 25/06/2013, 07:02
 
Fecha de Ingreso: enero-2010
Mensajes: 491
Antigüedad: 14 años, 3 meses
Puntos: 12
Respuesta: .hover en diferentes filas

Lo hice:
Código PHP:
Ver original
  1. <tr>
  2. <td><div class='cite'><?php echo $lista['cite']; ?>
  3. <div class="emerg" style="background:#fff;display:none;width:150px;height:50px;border:1px solid #555;clear: left;float:inherit;position:absolute;">Hola que tal</div>
  4. </tr>
  5. <tr>
  6. <td><div class='cite'><?php echo $lista['cite']; ?>
  7. <div class="emerg" style="background:#fff;display:none;width:150px;height:50px;border:1px solid #555;clear: left;float:inherit;position:absolute;">Hola que tal</div>
  8. </tr>

Código Javascript:
Ver original
  1. $(function() {
  2.     $("div.cite").hover(function(){
  3.         $("div.emerg").fadeToggle();
  4.     });
  5. });
pero me muestra en todas las filas el emergente
  #4 (permalink)  
Antiguo 25/06/2013, 07:53
Avatar de Lobito14  
Fecha de Ingreso: abril-2010
Mensajes: 222
Antigüedad: 14 años
Puntos: 17
Respuesta: .hover en diferentes filas

Creo que podrías hacerlo usando el $(this), y seleccionar el elemento hijo de ese elemento, para que solo haga la acción en el elemento que se hace hover en ese momento, sería algo así:

Código Javascript:
Ver original
  1. $(function() {
  2.     $("div.cite").hover(function(){
  3.         $(this).children("div.emerg").fadeToggle();
  4.     });
  5. });

También te faltan cosas en el código HTML, quiero entender que no nos has puesto todo el código para ahorrar espacio, pero te lo digo para que lo tengas en cuenta por si acaso.

Saludos.

Etiquetas: filas
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 12:54.