scroll-parallax-effect

スクロールによって css の値を変更することができるプラグインです。

This plugin allows you to change css values by scrolling.

このプラグインには 3 つの機能があります。

• Timing : 指定 位置を通過したときにクラスを追加します
• Speed : スクロール量に応じて css を変化させる
• Fit : 移動距離に応じて css を変化させる

This plugin has three functions.

• Timing : add a class when passing a specified position
• Speed : css changes according to the amount of scrolling
• Fit : change css according to distance traveled

Install

npm

npm install scroll-parallax-effect

yarn

yarn add scroll-parallax-effect

Document and Examples

Document and Examples

• typescript
• vue
• svg

Example

Typescript

• y scroll sample
• x scroll sample

Vanilla

• y scroll sample
• x scroll sample

SVG

• y scroll sample

Development

serve

yarn serve

build

npm run build

or

yarn build

test

yarn test

Previous versions

https://github.com/kamem/scrollParallax