jQuery：ランダムに移動する要素の速度を制御する

Question

私はこのコードをうまく動作させます。コンテナ内の要素をランダムに移動します。問題は、要素の速度を制御することができないことです。私はアニメーションメソッドの通常の持続時間のようないくつかのソリューションを試しましたが、それらのどれも働いていませんでした。どんな援助も感謝します。コード：

$(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(); 
    }); 
}; 

ザ・フィドル：https://jsfiddle.net/hjtkesaj/

Answer 1

.animateは、プロパティの後にミリ秒単位でオプションdurationのパラメーターを受け入れます。ハエは反復ごとに5秒かかり作る例：各反復のために、この値をランダム

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

（Fiddle）

は、フライのような混沌とした動きの安価な錯覚を作成するための良い方法かもしれません。