Animation in jQuery-js-Tutorial-php.cn

Animation in jQuery

炎欲天舞

Freigeben： 2017-08-04 15:26:28

Original

1043 Leute haben es durchsucht

1.show()-Methode und hide()-Methode

Steuern Sie den Anzeigestatus des Elements – Ein- und Ausblenden, während Sie die Höhe, Breite und Deckkraft des Inhalts ändern. Bis zu diesem Punkt sind drei Attributwerte 100 % oder 0 (Anzeige: keine). Entspricht der Anzeige in CSS: block/inline/none;

Hinweis: Die Verwendung von jQuery für Animationseffekte erfordert den Standardmodus, da es sonst zu Animationsjitter kommen kann. Der Standardmodus erfordert, dass der Dateiheader die folgende DTD-Definition enthält:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://wslideww.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Nach dem Login kopieren

Parameter: schnell – 200 ms, normal – 400 ms, langsam – 600 ms, angegebene Zahl (ms); Parameter sind keine Zahlen plus Anführungszeichen ist der Parameter numerisch und muss nicht hinzugefügt werden.

(1) fadeIn()-Methode und fadeOut()-Methode

Ändern Sie nur die Deckkraft des Elements – erhöhen und verringern Sie die Transparenz, bis das Element vollständig verschwindet (Anzeige: keine)

(2) slideUp()-Methode und slideDown()-Methode

Nur die Höhe des Elements ändern – reduzieren und erweitern

2.animate()-Methode — Benutzerdefinierte Animation

linkes Attribut: Dieses Attribut definiert das positionierte Element links Randgrenze und seinen enthaltenden Blockversatz dazwischen linke Grenzen.

Hinweis: Wenn der Wert des Attributs „Position“ „statisch“ ist, hat das Setzen des Attributs „links“ keine Auswirkung.

Format: animate(params,speed,callback)

(1) Der erste Parameter params: eine Zuordnung mit Stilattributen und -werten, Beispiel: {property: „value1“, property: „ Wert1". . . . }

(2) Der zweite Parameter Geschwindigkeit: Geschwindigkeitsparameter

(3) Der dritte Parameter Rückruf: Rückruffunktion, die Aktion, die ausgeführt wird, wenn die Animation abgeschlossen ist

Zusätzlich: ①Der Wert des Attributs kann akkumuliert oder dekrementiert werden, animate({left:"+=500px"})

②Legen Sie verschiedene Attribute fest, um mehrere Animationen gleichzeitig auszuführen, oder trennen Sie die Codes und führen Sie sie nacheinander aus

Die ③animate()-Methode arbeitet alle mit demselben jQuery-Objekt und kann Kettenschreiben verwenden, um mehrere Operationen zu erreichen

3. Animationsrückruffunktion

Animationswarteschlange: Animationseffekte werden nacheinander ausgeführt

Hinweis: Zur Animationswarteschlange können nur Animationsmethoden hinzugefügt werden. Methoden, die keine Animationen sind, werden nicht zur Animationswarteschlange hinzugefügt, sondern sofort ausgeführt Nicht-animierte Methoden durch Schreiben. Implementieren Sie die Warteschlangenbildung nicht-animierter Methoden in der Callback-Funktion.

Das obige ist der detaillierte Inhalt vonAnimation in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!