パララックス効果を簡単に実装するならSimpleParallax

パララックス効果を簡単に実装するならSimpleParallax

4月 20, 2021

パララックス効果取り入れたい時に使った、SimpleParallaxが便利だったのでご紹介します。
スマホでも機能します!

■読み込み

公式からcdnを読み込みます。
事前にjqueryも読み込んでおきましょう。

simpleParallax.js - Easy Parallax Effect for React & JavaScript

simpleParallax.js is a lightweight and e…
simpleparallax.com

SimpleParallaxで画像にパララックス効果を与えたい場合はimg要素である必要があります。
imgタグにclass名をつけ、ElementsByClassNameでクラス名を取得すれば完了です。

var image = document.getElementsByClassName(‘thumbnail’);
new simpleParallax(image);