webclips
【jQuery】リアルな波紋を再現するプラグイン「jQuery Ripple」
bodyや要素ごとに設定できるリアルな波紋を表現する面白いエフェクトです。エフェクトを指定した要素の背景は少しぼかしが入った画像等を使用すると効果的です。
jquery.ripples
Githubに公開されてますのでjquery.ripples.jsをダウンロードしてください。
使い方はjqueryとダウンロードした「jquery.ripples.js」を読み込ませます。
Java File
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.ripples.js"></script>
jsではエフェクトを適応させたいクラスなどを設定して完成です。
Java
$('.クラス').ripples({
resolution: 512,
dropRadius: 20,
perturbance: 0.04,
});
