Heim >Web-Frontend >HTML-Tutorial >Super cooles jQuery-Plug-in für Wasserwellenreflexion mit Spezialeffekten

Super cooles jQuery-Plug-in für Wasserwellenreflexion mit Spezialeffekten

黄舟
黄舟Original
2017-01-18 14:27:301579Durchsuche

Kurzes Tutorial

lake.js ist ein jQuery-Plug-in, das Wasserwellenreflexionseffekte erzeugen kann. Dieses JQuery-Plug-In kann jedes Bild in eine Leinwandkomponente umwandeln, sodass das Bild einen realistischen Wasserwellenreflexionseffekt erzeugen kann.

Verwendungsmethode

Fügen Sie JQuery- und Lake.js-Dateien in die Seite ein.

<script src="path/to/jquery.min.js"></script>                  
<script src="path/to/lake.js"></script>

HTML-Struktur

kann für jedes Bild einen Wasserwellenreflexionseffekt erzeugen.

<img id="lake-img" src="lake.png" style="display: none;"/>

Initialisierung des Plug-Ins

Nachdem das Seiten-DOM-Element geladen wurde, können Sie das JQuery-Water-Wave-Reflection-Plug-In mit der folgenden Methode initialisieren.

$(function() {
  $(&#39;#lake-img&#39;).lake({
    &#39;speed&#39;: 1,
    &#39;scale&#39;: 0.5,
    &#39;waves&#39;: 10
  });
});

Konfigurationsparameter

Das jquery Water Wave Reflection Plug-in verfügt über 3 verfügbare Konfigurationsparameter:

  • Geschwindigkeit: die Geschwindigkeit der Wasserwelle Bewegung.

  • Maßstab: die Höhe des Wellenkamms.

  • Wellen: Die Anzahl der Wasserwellen.

Das Obige ist der Inhalt des supercoolen jQuery-Wasserwellenreflexions-Plug-Ins. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn