1


html5リッチアニメーションを開発します。Illustratorでコンポーネントを既に設計しましたが、問題はこのコンポーネントをどのようにエクスポートするかです。Canvasオブジェクト経由?またはImage(png)経由?

コンポーネントにいくつかの変更があることに注意してください(ある時点で翼を得る花のように)。

  1. Canvasを使用すると、この追加を簡単に追加および削除できますが、Imageを使用する場合は、z-indexを使用して絶対的に追加する必要があります。
  2. 画像は許可なく私のコンポーネントをコピーすることを防ぎます(少なくともそれは誰もがそれらをベクター画像として取るのを防ぎます)。それでそれは本当に有利です。

ありがとう!、〜アルモグバクー

4

4 に答える 4

0

多くのスプライトと直接の相互作用を備えた高速なものが必要な場合、それは簡単です。キャンバスを使用してください。

このAPIは、他の言語のほとんどの2DグラフィカルAPIの1つと非常によく似ており、「直接」の描画と構成を可能にします。

たくさんのオブジェクトと変換があるとすぐに、htmlエンジンを使用して物事を構成および再描画することは非常に効果的ではありません。

于 2012-05-30T14:28:44.140 に答える
0

Illustratorはベクターアプリケーションであるため、ほとんどのHTML5ブラウザーでサポートされているSVG形式を調べることをお勧めします。

Illustrator HTML5 SVGパックはこちらから、説明はこちらから入手できます。

于 2012-06-09T13:27:58.690 に答える
0

svgを使用する場合は、 Raphaeljsライブラリをチェックアウトすると、javascriptからsvgを操作するのがはるかに簡単になります。

于 2013-01-26T10:40:18.570 に答える
0


using both JS and css animations/transictionsWeb用のリッチなアニメーション(短編映画)を作成するための最も簡単で強力な方法は..であることがわかりました。

sass + compassを使用して構築すると、簡単かつ強力になります。

なんで?と私の研究について

実際、私はこれと同じアニメーションフィルムを2回半作成しました。
最初は、jQueryのみを使用してフィルム全体を作成しました(非常に遅く、不器用で、作成が困難でした)。
それよりも、キャンバスを試してみましたが、スライドアップなどの一般的なトランジションを作成するのは非常に難しいことがわかりました。それで、私はいくつかの一般的なキャンバスライブラリを使用してそれを実装しようとします..そしてしばらくしてあきらめました(フィルムの1/5が完了しました)。
compass+sassとCSSANIMATIONS/ TRANSICTIONSを使用して最初から実装することを選択した場合よりも、この問題に対処するための最も強力で簡単な解決方法であり、開発が迅速であることがわかりました。

私はcssクラスによって検出されたcssアニメーション内のすべての「スライド」を実装しました。そして、cssアニメーションイベントをリッスンするJSを使用して、すべてのスライドの終わりを決定します。

于 2013-03-07T12:07:15.647 に答える