タグ

ブックマーク / zenn.dev/spicato_blog (1)

  • 最近好きな『要素が重なっていく表現』を簡単に再現してみた!

    スピッカートの金山(@spicato_kana)です。 久しぶり(約 1 年ぶり)のテックブログです。。。 今回は、最近よく見かける『要素が重なっていく表現』を再現してみたいと思います。 参考サイトリスト Casa ZIZO 株式会社ニューピース Heure Bleue この表現を使うことにより、レイヤー感を出すことで奥行きを出し立体感、没入感を出すことが出来るのかなと思っています。 実装方法はいろいろありますが、今回は GSAP を使って実装してみたいと思います。 実装内容 実際のコード内容を上記の codepen をご覧ください! 今回は、GSAP を用いていますが、GSAP を使わなくても IntersectionObserver を使って実装することも可能です。 また、GSAP のpinを使っているサイトが多いのですが、どうしても安定して実装することが難しく、iPhone だとずれ

    最近好きな『要素が重なっていく表現』を簡単に再現してみた!
  • 1