定位與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