https://github.com/webcyou/rippleeffectjs
MaterialDesign - RippleEffect JavaScript Library
https://github.com/webcyou/rippleeffectjs
Last synced: 4 months ago
JSON representation
MaterialDesign - RippleEffect JavaScript Library
- Host: GitHub
- URL: https://github.com/webcyou/rippleeffectjs
- Owner: webcyou
- License: mit
- Created: 2016-01-31T15:21:09.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-01-31T17:33:58.000Z (over 9 years ago)
- Last Synced: 2025-02-05T08:05:03.428Z (4 months ago)
- Language: JavaScript
- Size: 34.2 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# RippleEffectJS
- MaterialDesign - RippleEffect JavaScript Library
### これは何?
Material design対応。クリックまたはタッチで、リップルエフェクトを表示する、JavaScriptライブラリです。### demo
[デモページ](http://webcyou.com/ripple_effect_js/demo/)
デモページでは、設定を任意で変更可能です。
### Install
#### Bower
```
bower install ripple_effect.js
```### Basic Usage
```
```
### Advanced Usage
```
```
```
var rippleEffect = new RippleEffect();
```
Singleton Object#### Set Options
```
new RippleEffect(Options);
```### Options
```
new RippleEffect({
"color": "#ffffff"
});
```# Options Reference
| OptionName | DefaultValue | SetValue | OptionDetail|
| --------------- |:---------------:| -------------------- | -------:|
| color | '#64c7eb' | string | RippleEffectの色を指定 |
| width | '50px' | string | RippleEffectの幅を指定。isCircle trueの場合は、width,heightいずれかの最大値と同等となる。 |
| height | null | string | RippleEffectの高さを指定。isCircle trueの場合は、width,heightいずれかの最大値と同等となる。 |
| time | 500 | number (ms) | RippleEffectのアニメーションの速さを指定。 |
| image | null | string | 背景画像パスを指定。BackGroundImageSizeは、isCircle trueの場合は、width値と同等となる。 |
| isCircle | true | boolean | 円形判定。背景画像指定の際は、false指定。 |
| rippleClass | 'rf-ripple' | string (className) | RippleEffectの大枠のcssクラス名 |
| ripplePictureClass | 'rf-ripple-picture' | string (className) | RippleEffectの中身のcssクラス名 |### Author
Daisuke Takayama
[Web帳](http://www.webcyou.com/)### License
Copyright (c) 2016 Daisuke Takayama
Released under the [MIT license](http://opensource.org/licenses/mit-license.php)