2010-02-08 14 views
5

Todo,el div con relación a la posición del ratón

cómo la posición de la siguiente div relativa a la posición del ratón para que el ratón y el div no están fuera ofsync en theend del page.May ser como una información sobre herramientas que siempre sjows la posición perfecta al final de la página ..

<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> 

Gracias ........

+0

Cualquier cosa ............ – Hulk

+0

Lo que tienes funciona para mí. – graphicdivine

+0

esto me forma –

Respuesta

6

Usted puede tratar con este ejemplo,

$(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}); 
});
Cuestiones relacionadas