jQuery

【jQuery】スクロールダウンまたはアップ時に画像にスムーズなパララックスエフェクトを与えるArParallax

November 26, 2017
ArParallax.js

ArParallax.jsは軽量でカスタマイズ可能なjQueryプラグイン。CSS3の3D変換を使用してスクロールダウンまたはスクロールアップするときに画像に滑らかなパララックスエフェクトを作成します。

Installation

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="js/arparallax.min.js"></script>

Useage

HTML

<div class="arparallax">
	<div class="imageContainer">
		<!-- image or video -->
	</div>
</div>

JS

$('.arparallax').arparallax();

Options

  1. speed
  2. imageContainer
  3. blur
  4. blurMultiplier
  5. scaleMultiplier
  6. depth

MIT