髪を切って、きのこになりました。秋です。 ページを読み込んだときに、コンテンツをふわっふわっと表示させたい。 最近よく見るあれをやってみます。 ふわっという動きはcss3のtransitionで時間を制御。 「effect-fade」と「effect-scroll」、2種類のcssアニメーションを用意してスクロールをトリガーにjsで切り替えます。 html ふわっふわっと表示させたい要素に「effect-fade」というclassを付与します。 ブロックまるごとふわっとさせたい <section class="effect-fade"> <h1>タイトル1</h1> <p>説明文1</p> </section> <section class="effect-fade"> <h1>タイトル2</h1> <p>説明文2</p> </section> <section class="effect
![TIPS & NOTE 要素をふわっと出す、css3アニメーションで簡単エフェクト。 | Little Things](https://cdn-ak-scissors.b.st-hatena.com/image/square/c585b740269f899253173910e7859b8073e9f65c/height=288;version=1;width=512/https%3A%2F%2Fmanage.littlethings.jp%2Fupload%2Ffr_auto%2F01%2F1x%2Fblog%2F5ca6dcc3-640edb05.png%3Fv%3D20221020012326)