CSSのKeyframeを画面上で作成できるWebエディター 『Keyframes.app』

CSSのKeyframeをWeb上で

作成できる便利なWebエディター。

動きを付けるときに便利なKeyframeですが

動画エディタみたいに簡単に作成、コード取得できます。

keyframes2

Keyframes.app リンク先はこちらから

keyframes4

まずはAdd Stepをクリックして変更する場所を

挿入します。

0~100%までの間で自由にポイントを設定が可能です。

keyframes5

11%の所に挿入してみます。

たくさん挿入するとより細かなアクションを付けることが

できます。

keyframes6

11%はRotateを45degに設定しました。

0~11で45度傾くようになりました。

keyframes3

出来上がったアクションはCSSで簡単にコピペできます。

CSSで画像などにアニメーションを付けたいときに

簡単に使える便利なWebアプリです。

  • コメント: 0

10秒を切れるか?! AからZまでタイピングしてタイムを競うWebゲーム 『Type The Alphabet Game』前のページ

3DCGのヒントから映画を当てる、クイズで遊べるWebサービス 『3D Movie Quiz』次のページ

関連記事

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

PAGE TOP