Positionnement du div par rapport à la position de la souris

Question

Tous,

Comment positionner les éléments suivants div par rapport à la position de la souris pour que la souris et div sont pas ofsync à TheEnd du page.May être comme une info-bulle qui a toujours sjows la position parfaite à la fin de la page ..

<style type="text/css"> 
#div1 { width: 200px; height: 30px; background-color: #a9a9a9; color: #fff; position: absolute; } 
</style> 
<script src="jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function(){ 
$(window).mouseover(function(event){ 
$("#div1").css({'top': event.pageY, 'left': event.pageX}); 
}); 
}); 
</script> 
<div id="div1">mouseover me</div> 

Merci ........

Answer 1

Vous pouvez essayer avec cet exemple,

$(window).mouseover(function(event){ 
    var x = event.pageX, 
     y = event.pageY, 
     scX = $(window).scrollLeft(), 
     scY = $(window).scrollTop(), 
     scMaxX = scX + $(window).width(), 
     scMaxY = scY + $(window).height(), 
     wd = $("#div1").width(), 
     hgh = $("#div1").height(); 

    if (x + wd > scMaxX) x = scMaxX - wd; 
    if (x < scX) x = scX; 
    if (y + hgh > scMaxY) y = scMaxY - hgh; 
    if (y < scY) y = scY; 
    $("#div1").css({'top': y, 'left': x}); 
});