2

jQueryGlowこのフィドルに似たものを実現しようとしています。

具体的には、ロード時に開始し、JavaScriptが100ミリ秒の間隔で実行されて10秒間続くことを考えていました。発生するはずの背景色または要素Aは、グラデーション範囲(開始#000および終了#fff)を使用して変更され、要素Bの不透明度は変更されます(開始0および終了1)。したがって、100ミリ秒ごとに、不透明度は1(0.01、0.02、...、1.0)ずつ増加し、終了します。その間、要素Aの背景は#000から#fffへのグラデーションに沿って進みます。

jQuery Glowを見ると、この機能はそれほど難しくないはずですが、それをつなぎ合わせてもそれほど直感的ではないことがわかります。そのjsは、ホバリングとリンクにかなり適合しているように見えます。ロード時に異なる値を定義せず、所定の時間に終了します。

どうすればこれを行うことができますか?ありがとう。

4

2 に答える 2

0

setTimeoutは、JavaScriptアニメーションの唯一のオプションではなくなりました。

PaulIrishによるHTML5RocksのsetAnimationFrameをチェックしてください。ここでそれについて読んでください

バターのように滑らかな毎秒60フレーム。

このページをスクロールして...

リフロー-リペイントループが発生するアニメーションは避けてください。rAF呼び出しを更新して、最初のパラメーターとして高解像度のタイムスタンプを期待します。

最後に、

これの完全な概要を次のURLで入手してください:requestAnimationFrame API: ミリ秒未満の精度になりました

また、nnnnnnは正しいです。jQueryの主な強みは効果です。

しかし、JSWorldには、jQueryだけでなく、はるかに多くのものがあります。

手始めに、 CreativeJS.comをチェックしてください。

これはWebGLですが、さらに重要なのは、three.js(@mrdoobをフォロー)です。

ExtJSは、単にエンタープライズ向けのUIであり、アニメーション化されたインタラクションです。

そして、Raphaelは、今のところ、単に最も高度なSVGです。

言及に値する他のグラフィカルソリューションは、D3.js、HTML5 Canvas、およびCSS3Transformsです。

編集:AdobeEdgeはかっこいいと思いました。これは、キーフレームインターフェイスを備えたHTMLアニメーション生成のまったく新しいメタファーです...受け入れてください。批評家は、ベータ版の非セマンティックDIVを乗り越えることができませんでした。そのチームから、高度なHTMLアニメーションジェネレーターについてもっと聞くことができると思います...うん、彼らはいくつかの新しいものを手に入れました!

お役に立てば幸いです。ではごきげんよう!ナッシュ

于 2012-06-22T03:26:44.030 に答える
0

フェージング効果を試して、で使用してくださいsetTimeout。あなたは少し実験する必要があるでしょう、そして私はそれがうまくいくと思います:)

于 2012-06-21T06:26:30.710 に答える