ForgeComponents
el

Components

j-Animation

jComponent 20 · jcomponent@20 component Παράδειγμα φορτωμένο με jComponent 20

Αυτό το συστατικό μπορεί να animate στοιχεία με την τάξη .animation.


ΕΠΙΤΡΟΦΗ:

  • style {Number} Στυλ της Animation:
    • 1 ΟΠΑΣΙΑ
    • Η κλίμακα 2 από το μεγάλο έως το φυσιολογικό (default)
    • 3 Από μικρή σε κανονική
    • 4 Ροτάζ Z
    • 5 αλλαγή θέσης X
    • 6 αλλαγή της θέσης
  • delay {Number} καθυστέρηση μεταξύ της κινούμενης εικόνας (προεπιλογή: 200)
  • Η καθυστέρηση στην αρχική άσκηση init {Number} (προεπιλογή: 1000)
  • cleaner {Number} καθυστέρηση για καθαριστές τάξεων κινουμένων σχεδίων (προεπιλογή: 1000 πολλαπλασιάζεται με τον αριθμό των στοιχείων)
  • together {Boolean} Όλα τα στοιχεία θα αναζωογονηθούν μαζί (προεπιλεγμένο: false)
  • Το visible {Boolean} εκτελεί κινούμενα σχέδια όταν το στοιχείο με κινούμενη μορφή είναι ορατό (προεπιλεγμένο: false)
  • offset {Number} offset (από όριο) για την ορατότητα (προεπιλεγμένη: 50)
  • exec {String}: ένα σύνδεσμο με τη μέθοδο που θα εκτελεστεί μετά την κινούμενη
  • datasource {String} μια σύνδεση με την πηγή δεδομένων (αν η πηγή των δεδομένων θα τροποποιηθεί, τότε η κινούμενη εκτέλεση θα γίνει ξανά)
  • if {String} μια κατάσταση για το μονοπάτι (το ίδιο χαρακτηριστικό με το j-Part), αν η τιμή είναι ίδια με την τιμή του if, τότε η κινούμενη ενέργεια θα εκτελεστεί (εάν όχι, όλα τα στοιχεία θα αποκατασταθούν για την προηγούμενη κατάσταση)

Ετικέτα διαμόρφωση

Η διαμόρφωση του στοιχείου μπορεί να οριστεί με το χαρακτηριστικό data-animation="delay:100;order:3" και είναι προαιρετική:

  • Το noanimation {Boolean} απενεργοποιεί την κινούμευση για αυτό το στοιχείο (απομακρύνει μόνο την τάξη .animation)
  • delay {Number} καθυστέρηση (προεπιλεγμένη: config.delay)
  • Ο δείκτης παραγγελίας order {Number}, πρέπει να ξεκινήσει με το 1 ... (τα στοιχεία με την ίδια σειρά θα εμφανιστούν μαζί)
  • Το style {Number} είναι ένα προσαρμοσμένο στυλ

Χρησιμοποιήστε το με <ui-component name="animation">Όταν το στοιχείο δεν έχει φορτωθεί ακόμα, jComponent Κατεβάστε το για πρώτη φορά από τη διεύθυνση DEF.fallback (Η Componentator Συγγραφέας: Peter Širka. πηγή: το Componentator Ετικέτες Αξιολόγηση, MIT άδεια.

example.html
<ui-plugin path="form" class="container">
	<ui-component name="animation" config="style:6">
		<div class="row">
			<div class="col-md-3 m">
				<ui-component name="input" path="?.name" class="animation">Name</ui-component>
			</div>
			<div class="col-md-3 m">
				<ui-component name="input" path="?.price" config="type:number" class="animation">Price</ui-component>
			</div>
			<div class="col-md-3 m">
				<ui-component name="input" path="?.address" class="animation" data-animation="noanimation:1">Without animation</ui-component>
			</div>
		</div>
	</ui-component>
</ui-plugin>