AFFINGER5でロゴのアニメーションをする方法

AFFINGER5でロゴなどをアニメーションさせる方法をお伝えします。サイトを読み込んだ時にふわっと動かす設定方法です。

設定する場所は?

「AFFINGER5管理」→「その他」→「演出」で

【@keyframesによるアニメーション】の下にある

上から下:、下から上:などの枠にロゴのclassおよびIDを入れる

複数の設定をする場合は半角カンマ「,」で区切る

ロゴのclassってどこでわかるの?

公式サイトで一覧があります。

こういった表があります。

たとえばサイト名ロゴとスマホミドルメニューの場合は

“#head-l,.st-middle-menu”を枠の中に入れます

 

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)