jQueryスクロールしたらフェードインするエフェクトをファーストビュー内の要素にも対応する方法スクロールしたら要素がフェードインするエフェクト。CodePen.簡単に解説をすると以下のコードで要素が可視範囲に入ったら「scrollin」というクラスを付与しています。});そして実際の動きはcssで設定をしています。0);}.fadeinというクラスが付いている要素の透明度をゼロに。合わせて位置を50px下方に。スクロールして「scrollin」というクラスが付与されたら透明度と位置を戻しています。この方法だとページ読み込み時にフェードインする要素が画面内にあったとしてもスクロールをしないと要素が表示されません。スクロールをしないと本来フェードインしてくるはずの要素分の空間がぽっかりと空いてしまう状況になります。これを防ぐためには少しコードを書き換えます。CodePen.jQuery(window).scroll();こちらの記述を足して、即時でイベントを呼び出しています。重たい画像を使用している場合など、このエフェクトを使わない方が良いケースもありますが、ご参考までに。このような動作をさせる方法はいくつかありますが今回はそのうちの1つを紹介させていただきました。jQuery2段階でアニメーションさせるスクロールエフェクトCONTACTご意見やご感想、お仕事のご依頼などお気軽にご連絡ください。