グラデーションのアニメーション

こんにちは。

サイトの再起動計画ですが、今こんな感じ

元ネタはパンチアウト(マイクタイソンが出てくるほう)の最終戦直前の画面です。チャンピオンになった新聞のあとにでてきます。タイソン戦に行ける条件があったかどうかは忘れましたが、裏技のパスワード007 373 5963(007 みなさん ごくろうさん)でいきなりタイソン戦の場合は表示されなかったと思います。

そんな感じで、御覧のようにグラデーションのアニメーションを作っています。

決して遊んでるわけではなくて、もともとはカルーセルメニューって言うのを作りたかったんですよ。よくサイトにあるやつです。いくつかの新着情報みたいなのがスライドしていくやつ。↑の動画でもちらっと見えてる、なんかスライドしているところがまだ未完成のそれです。

でそれを作りたいのでコパイロットAIにCSSでのアニメーションについて聞いたら、transitionとかtranslateとかも教えてくれたんですけど、「いまどきはjavascriptでパラメータいじって作るのもありっすよww」みたいに言われたってわけです。

ほ~なるほどな~といろいろ試していった中で、唯一ものになったのがグラデーションをさらにアニメーションさせていくところだったと。これはこれでかっこいいので今後も使っていきます。カルーセルメニューはまだできてません。

SVGでもjavascriptでパラメータいじればアニメーションで来たんですね。なんかSVGはアニメーション用のタグがあったのでそれを使わないといけないのかと思ってた。教材の文字にもグラデーションかけちゃったりしてな。意味ないけど。

投稿者: KDH10

次のサイトもぜってえ見てくれよな。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です