2010-08-19 12 views
21

Comment positionner un div à côté d'un clic de souris à l'aide de JQuery?Comment placer une div à côté d'un clic de souris à l'aide de JQuery?

Merci

+1

Pourriez-vous ajouter un peu plus de détails? – XstreamINsanity

+0

@XstreamINsanity ... OK J'ai une table et quand vous cliquez sur une certaine cellule, elle charge quelque chose dans un DIV. Ce que je veux faire est d'afficher cette DIV où je viens de cliquer. Faites-moi savoir si cela a du sens? – Nasir

+0

Voulez-vous afficher l'emplacement du pointeur de la souris où vous cliquez sur DIV ou si vous cliquez sur DIV? – ppshein

Répondre

29

Vous pouvez essayer:

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

Après question a été posée dans le commentaire:

$("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

Un grand merci un trillion ça a marché ... Savez-vous comment je peux arrêter l'affichage DIV hors de cette table que je suis en train de cliquer? – Nasir

+0

Voici le concept auquel je pense: if ($ ('# DayInfo'). Est en dehors de $ ('# holiday-planner-table')) { afficher $ ('# DayInfo') avec moins d'autres } else {fais ton code} – Nasir

+0

Pense à ouvrir un nouveau sujet avec une nouvelle question décrivant ton problème supplémentaire. –

0

Quelque chose comme:

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

La position du div doit être réglé sur absolu.