「ぷるん」としたアニメーションの追求!

「animated CSS」という、便利なライブラリがあるのを初めて知りました。導入はとても簡単で、プロっぽい動きを簡単に採用できそうです。

・・・でも、animated CSSにはぷるんとした動きはない模様なので、

CSSのアニメーション(keyframe)で、ぷるんとした動きを作るか、ぐぐってよさげなコードを持ってこよう。


上のスライムをクリックすると、ぷるんとするようにしてみた。

(前回のぷるんとは、また少し違った感じにしました。)

このブログのテーマ「ルクセリタス」だと、cssは記事ごとに設定できても、javascriptは「子テーマの編集」から、全体のフッターに設定するしかないのだろうか?(とりあえず今はそのようにしています。)

 

こちらのプリンにも、適用されているかな?

・・・うむ、まだ私の理想とする「ぷるるん感」にはほど遠いが、おいしそうだ。

(※プリン画像のトリミングの参考にさせて頂きました:
 1行追加でOK!CSSだけで画像をトリミングできる「object-fit」プロパティー

コメント

タイトルとURLをコピーしました