Class: ParallaxEffect

plugin.ParallaxEffect

new eg.Flicking.plugin.ParallaxEffect(selector)

A plugin to add horizontal parallax effect attached with flicking interaction.

  • Should be targeted only one element per panel.
  • It can't be used with previewPadding option.

플리킹 인터렉션에 따른 가로유형 패럴렉스 효과 플러그인.

  • 각 패널당 한 개의 요소만 지정되어야 한다.
  • previewPadding 옵션과 같이 사용될 수 없다.
  • selector
    Type: String

    Target selector string within panel element

    패널 내에 위치한 대상 요소 셀렉터 문자열

Example
<div id="flick">
    <div><p style="background-image:url(a.png)">panel 0</p></div>
    <div><p style="background-image:url(b.png)">panel 1</p></div>
    <div><p style="background-image:url(c.png)">panel 2</p></div>
</div>
// as namespace usage
new eg.Flicking("#some")
 .plugin([
     // Apply parallax effect to '<p>' selector matched elements
     new eg.Flicking.plugin.ParallaxEffect("p")
 ]);

// as ESM import usage
import Flicking from "@egjs/flicking";
import {ParallaxEffect} from "@egjs/flicking-plugins";

new Flicking("#some")
 .plugin([
     new ParallaxEffect("p")
 ]);
See:
comments powered by Disqus