2010-08-19 10 views
21

¿Cómo coloco un div al lado de un clic del mouse usando JQuery?¿Cómo coloco un div junto a un clic del mouse usando JQuery?

Gracias

+1

¿Es posible añadir un poco más de detalles? – XstreamINsanity

+0

@XstreamINsanity ... OK, tengo una tabla y cuando haces clic en cierta celda, carga algo en un DIV. Lo que quiero hacer es mostrar este DIV donde acabo de hacer clic. Déjame saber si esto tiene sentido? – Nasir

+0

¿Desea mostrar la ubicación del puntero del mouse donde hace clic en DIV o funciona cuando hace clic en DIV? – ppshein

Respuesta

29

Usted puede tratar de:

$("td").click(function(event) { 
    $("#divId").css({position:"absolute", top:event.pageY, left: event.pageX}); 
}); 

Después También se preguntó en el comentario:

$("td").click(function(event) { 
    var div = $("#divId"); 
    div.css({ 
     position:"absolute", 
     top:event.pageY, 
     left: event.pageX}); 

    var delayTimer = setTimeout(function() { 
     $that.fadeIn("slow"); 
    }, 100); 

    div.mouseover(function(event) { 
    if (delayTimer) 
     clearTimeout(delayTimer); 
    }).mouseout(function(){ 
    if (delayTimer) 
     clearTimeout(delayTimer); 
    var $that = $(this); 
    delayTimer = setTimeout(function() { 
     $that.fadeOut("slow"); 
    }, 500)   
    }); 
}); 
+1

Muchas gracias, un billón de dólares funcionó ... ¿Sabes cómo puedo evitar que el DIV se muestre fuera de esta mesa en la que estoy haciendo clic? – Nasir

+0

Aquí está el concepto en el que estoy pensando: if ($ ('# DayInfo'). Está fuera de $ ('# holiday-planner-table')) { mostrar $ ('# DayInfo') con menos coordenadas } else {haz tu código} – Nasir

+0

Considera abrir un nuevo hilo con una nueva pregunta que describa tu problema adicional. –

0

algo como:

$('#cell').bind('click', 
    function(e){ 
     $('#div').css('left',e.pageX + 'px'); 
     $('#div').css('top',e.pageY + 'px'); }); 

La posición del div se debe establecer en absoluto.

Cuestiones relacionadas