0

私はこのjavascriptチュートリアルを読んでいました: http ://www.switchonthecode.com/tutor...ccordion-menus 基本的に、jqueryではなく純粋なjavascriptを使用してアコーディオンを作成する方法を示しています。アニメーションの追跡の実際の部分まで、すべてが私には理にかなっています。「そのため、アニメーション関数で最初に行うことは、最後のアニメーションの反復からどれだけの時間が経過したかを把握することです」と彼は言います。そして、このコードを使用します:コード:

var elapsedTicks = curTick - lastTick;

lastTickは、関数が呼び出されたときの値(Date()。getTime())に等しく、curTickは関数が受信されたときの値に等しくなります。ここでなぜ一方を他方から減算しているのかわかりません。これらの2つの値の間に顕著な時間差があるとは想像できません。または多分私は何かが欠けています。そのanimate()関数は、メニュータイトルがクリックされるたびに1回だけ呼び出されますか、それともインクリメンタルアニメーション効果を作成するために数回呼び出されますか?

setTimeout("animate(" + new Date().getTime() + "," + TimeToSlide + ",'" + openAccordion + "','" + nID + "')", 33); 

ご回答ありがとうございます。

4

1 に答える 1

0

lastTickは、関数が呼び出されたときの値と同じです

lastTickアニメーションの最後のフレームで、関数が以前に呼び出されたときの値と同じです。それ以来、スクリプトはブラウザに制御を戻し、33ミリ秒以内にコールバックするように要求しています。

したがって、curTick-lastTick通常は33になりますが、同時に発生する他の問題のためにブラウザーが遅れている場合は、はるかに高くなる可能性があります。これが、時間の読み取りを行う必要がある理由です。

通常、この種のコードでは、アニメーションの開始時刻を変数に保存し、setInterval毎回完全に新しいタイムアウト関数を設定する(特に文字列からのタイムアウトを設定する)代わりに、頻繁にチェックするために使用します。超醜いです)。

eta:

次に、現在の時刻を渡すanimate()関数を実行します

いいえ。set-timeout呼び出しをもう一度見てください。

setTimeout("animate(" + new Date().getTime() + ","...

それは文字列を作っています。タイムアウト呼び出し時ではなくnew Date().getTime()、タイムアウト設定時に評価されます。最終的に次のような文字列を作成します。

setTimeout("animate(1275139344177, 250, 'Accordion4Content', 'Accordion4Content')", 33)

これは最後のフレームの終わりの時間であり、次のフレームのタイムアウトが発生する時間ではありません。

このような文字列にJavaScriptコードを入れることは非常に混乱し、エスケープの問題に満ちており、一般的には本当に悪い習慣と見なされています。インライン関数を使用してそれを行う方が明確です。

var passTick= new Date().getTime();
setTimeout(function() {
    animate(passTick, TimeToSlide, openAccordion, nID);
}, 33);
于 2010-05-29T12:20:31.457 に答える