ホームページ > ウェブフロントエンド > htmlチュートリアル > 超クールな jQuery 水波反射特殊効果プラグイン

超クールな jQuery 水波反射特殊効果プラグイン

黄舟
リリース: 2017-01-18 14:27:30
オリジナル
1550 人が閲覧しました

簡単なチュートリアル

lake.js は、水の波の反射の特殊効果を作成できる jQuery プラグインです。この jquery プラグインは、任意の画像をキャンバス コンポーネントに変換できるため、画像でリアルな水の波の反射効果を生成できます。

使用方法

jquery と Lake.js ファイルをページに導入します。

<script src="path/to/jquery.min.js"></script>                  
<script src="path/to/lake.js"></script>
ログイン後にコピー

HTML 構造

は、あらゆる画像に水の波の反射効果を作成できます。

<img id="lake-img" src="lake.png" style="display: none;"/>
ログイン後にコピー

初期化プラグイン

ページの DOM 要素が読み込まれた後、次の方法で jquery 水波反射プラグインを初期化できます。

$(function() {
  $(&#39;#lake-img&#39;).lake({
    &#39;speed&#39;: 1,
    &#39;scale&#39;: 0.5,
    &#39;waves&#39;: 10
  });
});
ログイン後にコピー

設定パラメータ

jquery 水波反射プラグインには 3 つの利用可能な設定パラメータがあります:

  • speed: 水波の動きの速度。

  • スケール: 水の波の頂点の高さ。

  • waves: 水の波の数。

上記は、非常にクールな jQuery 水波反射特殊効果プラグインの内容です。その他の関連コンテンツについては、PHP 中国語 Web サイト (m.sbmmt.com) に注目してください。


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート