jQueryとCSSでスクロール時に画像を下からふわっと表示させる方法 + ネイティブ javascriptでの書き方も掲載！

スクロールしていくと画像やコンテンツがふわっと表示されるWEBサイトってカッコイイですよね。動きがあると読者の目を引くだけでなく、WEBサイトがリッチになるのでぜひ取り入れたいエフェクトです。 僕もこのサイトに実装してみたので、その方法を書いていきたいと思います。単純にjQueryとCSSで作成する方法だけでなく、ネイティブjavascriptで書く方法も合わせてご紹介します。 デモはコチラ↓ ふわっと表示（フェードイン）させる仕組み 仕組は至って簡単です。 まず、ふわっとさせたい画像やコンテンツなどの要素にCSSのopacityを使って透明にします。さらに下から出てくるようにtransformで少し下の方に設置。 そしてある一定のところまでスクロールされた時に、jQueryやjavascriptを使ってCSSの値を書き換えて、要素をふわっと表示させるだけの簡単な仕組みです。 実装方法 そ

[seokundayo]

ユーザーの体感待機時間におけるユーザービリティ改善として有効