2

私は、動的な値に依存するこの位置を持っています。より短い距離をより速くアニメーション化する必要がありますが、同じ量の加速度 (速度) の外観を持つことは理にかなっています。ただし、jquery のドキュメントでは、期間を定義する方法しか見当たりません。これは、多くの場合は問題ありませんが、他の場合は問題ありません。値が小さい場合は持続時間も短く、値が長い場合は持続時間が長くなるように速度を定義するにはどうすればよいですか。ありがとう。

4

1 に答える 1

2

jQuery アニメーションは時間しか受け付けないため、時間を計算して特定の速度を得ることができます。

time = pixels / desired pixels per second

したがって、アニメーションが 200 ピクセルをカバーし、目的の速度が 100 ピクセル/秒の場合、次のように単純に計算します。

time = 200px / 100 px per sec = 2 sec = 2000ms

アニメーションが 40 ピクセルをカバーする場合、次のようになります。

time = 40px / 100 px per sec = 0.4 sec = 400ms

次の形式を使用して、この作業を行う独自のバージョンの jQuery animate を作成することもできますanimate(properties, options)。

jQuery.fn.speedAnimate = function(properties, options, val, rate) {
    options.duration = (val / rate) * 1000;
    return this.animate(properties, options);
}

val使用したい任意の単位 (ピクセルが最も一般的です) と単位rate/秒です。

于 2015-01-06T02:38:12.930 に答える