定位与jQuery

Question

创建我有一个jQuery函数来创建一个简单的div一个div元素，代码如下 - var mouseX;var mouseY;

$(document).mousemove(function (e) { 
    mouseX = e.pageX; 
    mouseY = e.pageY; 
}); 

function createObj() { 
    var o = $('<div />'); 
    o.addClass('myDiv'); 
    o.css({'top':mouseY,'left':mouseX}).fadeIn('slow'); 
    $(document.body).append(o); 
} 

我的问题是，第一个div是在要求的位置上创建的，但如果我再次调用该函数来创建另一个div，它创建在第一个div下面，而下一个创建在第二个下面等。

如何在当前鼠标位置创建新div？

Answer 1

这段代码正在做你想做的事情，你不能分辨出div是在顶部还是在彼此之下，因为它们具有相同的颜色。

此代码会为每个新的div随机颜色，所以你可以看到，新的实际上是对旧的顶部：

var colors = ["blue", "red", "lime", "purple"]; 
color = colors[Math.floor(Math.random()*colors.length)]; 

$(document).mousemove(function (e) { 
    mouseX = e.pageX; 
    mouseY = e.pageY; 
}); 

function createObj() { 
    var o = $('<div />'); 
    o.addClass('myDiv'); 
    o.css({'top':mouseY,'left':mouseX, background: color}).fadeIn('slow'); 
    $(document.body).append(o); 
    color = colors[Math.floor(Math.random()*colors.length)]; 
} 
$(document).click(createObj); 

DEMO