アニメーションブロックのアニメーションのバリエーションが増えました!

Lightning Pro および Katawara に付属する VK Blocks Pro に入っているアニメーションブロックに「左右」「上下」「ぶるぶる(Y方向)」「ぶるぶる(X方向)」「どきどき」「ゆらゆら」を追加しました。VK Blocks Pro 0.41 〜 利用可能です。

それぞれ「アニメーションの速度」「アニメーションの距離」が設定できるので組み合わせで面白い表現が出来るのではないかなと思います。

フェードイン 早い

フェードイン 標準

フェードイン 遅い

スライドアップ 速い 短い

スライドアップ 標準 標準

スライドアップ 遅い 長い

スライドアップ 非常に遅い 長い

左右 速い 短い

左右 標準 標準

左右 遅い 長い

左右 非常に遅い 長い

上下 速い 短い

上下 標準 標準

上下 遅い 長い

上下 非常に遅い 長い

Trembring Y 短い

Trembring Y 標準

Trembring Y 長い

Trembring X 短い

Trembring X 標準

Trembring X 長い

どきどき 速い 短い

どきどき 標準 標準

どきどき 遅い 長い

どきどき 非常に遅い 長い

ゆらゆら 非常に速い 標準

ゆらゆら 速い 標準

ゆらゆら 標準 標準

ゆらゆら 遅い 標準

ゆらゆら 非常に遅い 標準

ゆらゆら 非常に遅い 短い

ゆらゆら 非常に遅い 標準

ゆらゆら 非常に遅い 長い

アニメーションブロックを入れ子にして複数の動きを設定してみたりもできるようです…(動作保証外)

ただ、残念ながら同じ領域内で複数のアイテムをアニメーションさせるのは難しいです。上記の例で言えば ラ○ュ○ と雲をそれぞれ違う動きにするのは難しいです。

雲をラ○ュ○の上や下のブロックとして配置すれば一応可能ではあります。
あるいは、重ねたい要素のブロックにHTMLアンカーなどをつけて、そのアンカーに対して CSS で position 指定して上または下にオフセットして重ねるという形ならできなくはないと思います。

VK Blocks Pro のユーザーの方はぜひお試しください。

初心者でも簡単!無料WordPressテーマ

100%GPL / 商用利用可能

Lightning は WordPress公式ディレクトリに登録されているカスタマイズ性の高いテーマです。
デモデータも配布されているので、ビジネスサイトの雛形が数分でセットアップできます。

VWSオンラインコミュニティー

オンラインコミュニティでは、より良いテーマ・プラグイン開発のため、機能改善・追加要望などの書き込み大歓迎です!
ユーザー同士の交流や意見交換の場としてもお気軽にご参加ください。
※質問はフォーラムでのみ対応となります。