jQuery: ovládanie rýchlosti prvku, ktorý sa pohybuje náhodne - jquery, animácia

Mám tento kód, ktorý funguje dobre. Náhodne pohybuje prvok vo vnútri kontajnera. Problém je v tom, že nedokážem ovládať rýchlosť prvku; vyskúšal som niekoľko riešení (napríklad normálne trvanie animácie), ale žiadne z nich nefungovalo. Akákoľvek pomoc by bola ocenená. Kód:

$(document).ready(function () {
animateDiv();
});

function makeNewPosition() {
var h = $(".main-translucid").height() - 50;
var w = $(".main-translucid").width() - 50;

var nh = Math.floor(Math.random() * h);
var nw = Math.floor(Math.random() * w);

return [nh, nw];
}

function animateDiv() {
var newq = makeNewPosition();
$(".fly").animate({
top: newq[0],
left: newq[1],
right: newq[0],
bottom: newq[0]
}, function() {
animateDiv();
});
};

Fiddle: https://jsfiddle.net/hjtkesaj/

odpovede:

.animate prijíma voliteľné duration parameter v milisekundách po vlastnostiach. Príklad, ako letieť, trvá 5 sekúnd na iteráciu:

function animateDiv() {
var newq = makeNewPosition();
$(".fly").animate({
top: newq[0],
left: newq[1],
right: newq[0],
bottom: newq[0]
}, 5000, function() {
animateDiv();
});
};

(husle)

Randomizácia tejto hodnoty pre každú iteráciu by mohla byť dobrým spôsobom, ako vytvoriť lacnú ilúziu chaotického pohybu podobného letu.