Создание моей собственной подсказки jquery plugin - относительно мыши, как узнать, где находится мышь?

Question

нормально, в основном я сделал 2 функции: показать подсказку и скрыть подсказку, и он может получить АЯКС конфигурации или простой конфигурации, я просто показать вам:

<style type="text/css"> 

    .nube{display:none; height:auto; width:auto; position:absolute; z-index:99; left:200px; 
      background-color:#fff; 
      color:#999; border:1px solid #EEE; padding:20px; padding-top:10px; padding-bottom:10px; 
-moz-border-radius-bottomleft: 0em; 
    -webkit-border-bottom-left-radius: 0em; 
-moz-border-radius-bottomright: 0.8em; 
    -webkit-border-bottom-right-radius: 0.8em; 
-moz-border-radius-topright: 0.8em; 
    -webkit-border-top-right-radius: 0.8em; 
-moz-border-radius-topleft: 0.8em; 
    -webkit-border-top-left-radius: 0.8em; 
} 

</style> 

И это скрипт

<script type="text/javascript"> 

function mostrar_tooltip(div,contenido,ajax){ 
    /// for now this 'if' is returns false allways so the last line its executed only 
    if(contenido != ''){ 
    if(ajax == 0){ 
     // entonces no hay que 
     $('#'+div).load('#'+contenido); 
    }else{ 
     // contenido contiene la palabra clave a enviar a router 
     $('#'+div).load('./router.php?que=tooltip&clave='+contenido); 
    } 
    // ya tenemos el contenido en el div (esta oculto y posicionado con CSS 
    } 
    $('#'+div).css({position:'fixed', top:($(window).scrollTop()+200)+"px", left:"200px"}) 
    $('#'+div).fadeIn(300); 

} 

function ocultar_tooltip(div){ 
    $('#'+div).fadeOut(100); 
} 


</script> 

HTML выглядит

<span class="nube" id="tip"> TIP HERE </span> 

<p onmouseover="mostrar_tooltip(tip,'',0)" onmouseout="ocultar_tooltip(tip)"> HOVER ME </p> 

он отлично работает, но проблема это то, что я хочу его по отношению к мыши, а не свитка ...

Я бы хотел, чтобы всплывающая подсказка была относительно позиции мыши, могу ли я это сделать?

я знаю, что-то делать с

.css({top:evt.pageY, left:evt.pageX}) 

и

function(evt){} 

, но я не знаю, как совместить это ...: S спасибо!

Answer 1

Тони,

Вот некоторая очень простая подсказка код с JavaScript на моем собственном сайте. Он позиционирует всплывающую подсказку относительно курсора. Возможно, вы можете соответствующим образом изменить ваш.

$(slide).hover(
    function(event){ 
    $('#tooltip').css({position: 'absolute', top: (event.pageY - 10), left: (event.pageX + 20)}).show("fast");  
    }, 
    function(){ 
    $(tooltip).hide("fast"); 
    } 
); 

Сама подсказка:

<div id='tooltip'>Right-click to download</div>

CSS-код для этого есть:

#tooltip{ 
display: block; 
position: absolute; 
z-index: 9999; 
border: 2px solid: #000; 
background: #fff; 
color: #000; 
padding: 3px 6px; 
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-size: 12px; 

}

С уважением Нил