【jQuery】データ属性を使用してパララックス効果を設定する[data-parallax]

data-parallaxはデータ属性を使用して簡単にパララックス効果を設定するためのjQueryプラグイン。

Installation

<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/jquery.requestAnimationFrame/jquery.requestAnimationFrame.min.js"></script>
<script src="bower_components/jquery-data-parallax/jquery.data-parallax.min.js"></script>

Usage

使用データの属性

<div data-parallax='{"y":"70%","scale":2,"rotate":180,"opacity":0}'></div>

javascript

$("#selector").parallax({
"y": "70%",
"scale": 2,
"rotate": 180,
"opacity": 0
});

Properties

<div data-parallax='{"opacity":{"to":1,"from":0.5,"duration":100},"translateY":"50%","duration":200}'></div>

MIT

 
[data-parallax]

【jQuery】データ属性を使用してパララックス効果を設定する[data-parallax]

  • LATEST
  • RELATED
  • POPULAR