跟蹤整個頁面上的隨機div

嘗試在頁面上隨機移動div。目前新的隨機生成的div出現在頁面上的新位置，而不是轉換到新位置（我希望div跨頁面跟蹤而不是刪除自身並重新出現）。跟蹤整個頁面上的隨機div

function randomdiv1() { 
 
    var divnum = $('.random').length; 
 
    var random = $('.random'); 
 
    var startleft =random.css('left', (Math.floor(Math.random() * ($(window).width()-50)))); 
 
    var starttop =random.css('top', (Math.floor(Math.random() * ($(window).height()-50)))); 
 
    return [startleft, starttop]; 
 
} 
 

 
function randomdiv2() { 
 
    var divnum = $('.random').length; 
 
    var random = $('.random'); 
 
    var endleft =random.css('left', (Math.floor(Math.random() * ($(window).width()-50)))); 
 
    var endtop =random.css('top', (Math.floor(Math.random() * ($(window).height()-50)))); 
 
    return [endleft, endtop]; 
 
} 
 

 
function randomdiv3() { 
 
    var startdiv = randomdiv1(); 
 
    var enddiv = randomdiv2(); 
 
    $('.random').animate({ 
 
    top: enddiv[1], 
 
    left: enddiv[0], 
 
    }, 2000, 'swing', randomdiv3); 
 
} 
 

 
randomdiv3();

.random { 
 
    width: 50px; 
 
    height: 50px; 
 
    background-color: blue; 
 
    position: absolute; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <title></title> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
 
    <script src="script.js"></script> 
 
</head> 
 
<body> 
 
    <div class="random"></div> 
 
</body> 
 
</html>

來源

2016-10-05 keigwin

['css（）']（http://api.jquery.com/css/）函數，當用兩個參數調用時，返回您調用該函數的jQuery對象。因此，在'randomdiv3'' top：enddiv [1]'將'top'設置爲一個jQuery對象，這並沒有什麼幫助。 –