javascript - div出现在鼠标坐标上

Question

我创建了一个简单的列表。我想让 div img 在悬停其中一个 li 时出现。我想让 img div 出现在当前鼠标坐标处。

我可以让它全部工作，但不是在坐标上:

http://jsfiddle.net/tmyie/fwgRE/2/

HTML:

<ul>
    <li>one</li>
    <li>two</li>
    <li>three</li>
</ul> 
<div class="img"> </div>

CSS:

ul {       
    font-size: 24pt;
}   
.img {
    display:none;
    width: 35px;
    height: 35px;
    background-color:salmon;
    position: absolute;;
}

jQ:

$('li').mouseenter(function(){
    $('.img').fadeIn();
});  
$('li').mouseleave(function(){
    $('.img').fadeOut();
});

Answer 1

将您的 js 代码更改为:

$('li').mouseenter(function(e){
    $('.img').css({left:e.pageX, top:e.pageY}).fadeIn();
});

会做的工作