[SOLUCIONADO] Función "click" en vez de hover

[NaRanJiTo78]

Hola!

Tengo el siguiente script que hace aparecer un div cuando se hace hover en un botón:

Código:

  $(document).ready(function(){
  // se ejecuta el evento hover al pasar el mouse por encima 
  $(".selector").hover(function(){
  // cogemos el id del li por el que estamos pasando por encima 
  var id=$(this).attr("id");
 // mostramos el div que tiene una clase que se llama como el id
 $("."+id).show(); },function(){
 // esta función se ejecuta cuando pierde el foco 
 var id=$(this).attr("id"); $("."+id).hide(); }) });

El caso es que el contenido del div es un formulario, por lo que cuando bajas del botón a dicho formulario, desaparece porque ya no estás haciendo hover en el botón...

Screenshot del problema: http://prntscr.com/30pfh2

Url del site: http://goo.gl/aZUT6W

Cómo puedo modificar el código javascript para que en vez de hover sea con función "click", o que el contenido del div no desaparezca?



Gracias por adelantado!

[andresgarciadev]

no deberias poner ese formulario en una posicion estatica.... bueno... aunque si me fijo bien muchas mas cosas de la pagina lo estan xD ... pero bueno.... la solucion a eso enves de hacerte tanto problema seria agregar el formulario dentro del li de tal manera cuando le hagas hover al formulario detectara que sigue en el li y no se perdera el foco

[NaRanJiTo78]

Gracias por tu respuesta Andres, lo he dejado en display:block para poder trabajar en el div y poder verlo, porque sino me desaparece xD ya que de jQuery no entiendo mucho, por eso preguntaba que como se hacía la función...

[Alexis88]

Si deseas reemplazar el método hover por el método click, basta con que cambies el nombre y quites la función que se ejecuta cuando se retira el puntero del mouse del elemento.

Código Javascript:

$(".selector").click(function(){
    var id = $(this).attr("id");
    $("."+id).show();
});
 

Saludos

[NaRanJiTo78]

Mil gracias Alexis88!! Eres un genio!!

Y hay alguna manera que desaparezca el div al volver a hacer click, o al mover el ratón fuera del div?

[Alexis88]

Claro, solamente comprueba si está visible o no, de acuerdo a eso, lo muestras u ocultas.

Código Javascript:

var id = $(this).attr("id");
    if ($("."+id).css("display") == "none")
        $("."+id).show();
    else
        $("."+id).hide();
});
 

Saludos

[NaRanJiTo78]

Éste sería el código completo?

Código:

 $(document).ready(function(){
$(".selector").click(function(){
    var id = $(this).attr("id");
    $("."+id).show();
});
var id = $(this).attr("id");
    if ($("."+id).css("display") == "none")
        $("."+id).show();
    else
        $("."+id).hide();

});

Esque así no me funciona...algo habré puesto mal

[Alexis88]

Disculpa, no lo puse completo:

Código Javascript:

$(".selector").click(function(){
    var id = $(this).attr("id");
    if ($("."+id).css("display") == "none")
        $("."+id).show();
    else
        $("."+id).hide();
});
 

[NaRanJiTo78]

Mil gracias y buen fin de semana!!