←

アニマトメ

実装手順など解説

mvの疑似要素で黒い四角2つを作り、transformで上下に移動させるだけ。
黒の抜ける速度と、白タイトルがアニメ開始前に出ているのがミソ。
アニメ自体はシンプルなので、背景をリッチな動画にする or その他のアニメーションと組わせるのがより効果的かも。

参考サイト・元ネタなど

動作環境

  • ○:動作する
  • △:動作するが意図せぬ挙動
  • ☓:動作しない
- Mac Windows11 SP
ブラウザ Chrome Firefox Safari Chrome Firefox Edge IE Safari on iOS Chrome for Android
対応 ○

シネマ風に上下に黒がわかれる

UMA MUSUME

メッセージ

↑
  • 2025-1-5

    わぁ。。素敵なアニメーショ…

    20
  • 2022-9-15

    おっ、トレーナー！今日もお…

    19
  • 2022-9-4

    トレーナーさん、今日もはり…

    14
  • 2022-8-29

    最近、トレーナーが全然更新…

    30
  • 2022-5-5

    あ、トレーナーさん！こんに…

    22
  • 2022-4-10

    昨日はずいぶん暖かい日和だ…

    25
  • 2022-4-3

    今日は久しぶりにアニメが増…

    21
  • 2022-3-21

    やぁ、はじめましてかな。ト…

    28
  • 2022-3-10

    あれ…今週は特にアニメが増…

    27
  • 2022-3-2

    今日の更新はホバーアニメや…

    13
  • 2022-2-24

    今週は水曜祝日だったから1…

    10
  • 2022-2-20

    こんにちは！

    20
  • 2022-2-15

    先週は世話になったな、オグ…

    21
  • 2022-2-11

    聞いてくれ、タマ。

    10
  • 2022-2-3

    やぁタマ。今回は何が更新さ…

    13

トレセン学園