0

10 分の 1 秒ごとにドキュメントに div を追加し、ページの端に向かってランダムな方向にアニメーション化してから削除するコードがあります。現時点ではフレーム レートが非常に低いため、div がページの端からはみ出したときに div を自動的に削除する方法があるかどうか疑問に思っていました (左または上の値が 100% を超えているか、0% を下回っています)。

または、フレームレートを上げる他の方法があれば...

コードは次のとおりです。

    function myFunction() {  

//the following generates four random numbers between 100-400 and asigns 2 of them to be the top and left values

var RN=Math.floor(Math.random()*2);
var RN2=Math.floor(Math.random()*2);
var RNMB4=Math.random()*300+100;
var RNMB2=Math.random()*300+100;
var RNMB3=Math.abs(Math.random()*300) * -1;
var RNMB1=Math.abs(Math.random()*300) * -1;
var NMBRS=[RNMB1,RNMB2];
var NMBRS2=[RNMB3,RNMB4];
    $("<div/>").appendTo('body').animate({
            left: NMBRS[RN] + '%',
            top: NMBRS[RN] + '%',
            }, 
            1000), function(){$(this).remove();});
    }

    setInterval(myFunction,100);
4

2 に答える 2

0

requestAnimationFrame メソッドを使用してアニメーションのパフォーマンスを向上させることができますが、この API には通常ベンダー プレフィックスが必要であり、後方互換性はありません。

もう 1 つ、アニメーション要素を position: absolute に設定する必要があります。要素がドキュメントのリフローを作成しないようにします。

高機能なjsアニメーションライブラリであるGreensockを利用できます。また、jQuery の animate メソッドをスムーズにする jquery プラグインもあります。

ところで、不要な括弧はコードを不一致にします...コードを貼り付けるときのタイプミスでしょうか?

于 2013-04-28T16:42:53.767 に答える