各種テストのパターンエディタ

編集したい要素をクリックすると下記編集メニューが表示されます。

項目名 詳細 編集可能な要素
html編集 選択した要素のhtmlを編集することができます すべての要素
属性編集 選択した要素の属性を追加・削除することができます すべての要素
テキスト編集 選択した要素のテキストを編集することができます 画像以外のすべての要素
クラス編集 選択した要素のクラスを追加・削除することができます すべての要素
スタイル編集 選択した要素のCSSスタイルを編集することができます すべての要素
ボタン編集 選択した要素のボタンを変更することができます。 フォームのボタン・リンク
リンク編集 選択した要路の後にリンクを挿入することができます。 すべての要素
移動・サイズ変更 選択した要素の移動・大きさの変更をすることができます すべての要素
html挿入 選択した要素の後にhtmlを挿入することができます。 すべての要素
テキスト挿入 選択した要素の後にテキストを挿入することができます。 すべての要素
画像挿入 選択した要素の後ろに画像を挿入することができます。 すべての要素
要素を隠す 選択した要素を隠すことができます。 すべての要素
アニメーション編集 選択した要素にアニメーションを追加することが出来ます。 すべての要素

アニメーションの種類

  • 点滅する
  • 横に震える
  • 縦に震える
  • 振り子
  • 拡大縮小
  • 回転
  • 突然回転する
  • 左からスライドイン
  • 右からスライドイン
  • 上から降りる
  • 下から登る
  • スケールイン(拡大)
  • スケールイン(縮小)
  • ホイールイン
  • スピンイン

アニメーションには繰り返しの回数、アニメーションに掛ける時間、開始条件を設定することもできます。

開始条件

条件
ページ読み込み ページが読み込まれた時開始します。
クリック アニメーションする要素をクリックした時開始します。
ホバー アニメーションする要素にマウスカーソルが乗った時に開始します。
スクロール アニメーションする要素までスクロールした時に開始します。