1

私はクールなアイデアを持っていますが、これを達成する方法にちょっとこだわっています。

これは、跳ねるボールのアニメーションを作成するためのチュートリアルです: 跳ねるボールのアニメーションのチュートリアル

似たようなものを作成したいと思いますが、ワームのようなラインがあります。ラインは進行方向を向き、壁に当たると方向が変わります。

これには、私が理解できない2つの部分があると思います。

  1. ラインを進行方向に向けるにはどうすればよいですか? CSS の使用。
  2. ラインがコンテナー (スクリーンなど) の端に到達したときに、ワームのような方向の変化を得るにはどうすればよいですか?

前もって感謝します!

4

1 に答える 1

2

これを CSS だけで行うのは非常に困難です。ボールは丸いので、「当たって」エッジに当たると跳ね返ります。ラインが跳ね返り、跳ね返る途中で、ラインは 2 つの方向 (壁から跳ね返った部分と跳ね返っていない部分) に進みます。CSSだけでは簡単にはできません。

線を希望する方向に移動するには、正しい量の変換を使用するだけです。回転して、移動しているのと同じ方向を向くようにします。繰り返しますが、これは機能し、線が壁にぶつかるまでは見栄えがします。

于 2013-04-11T17:36:16.433 に答える