Μια νέα βιβλιοθήκη κινούμενων σχεδίων με απλή σύνταξη για τη βελτίωση του UI με εφέ κίνησης, με έμφαση στις επιδόσεις και την προσβασιμότητα.
- Αστέρια στο GitHub
- 1.6K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Sal
Αυτή η βιβλιοθήκη επιτρέπει στους προγραμματιστές να εμπλουτίζουν τις διαδικτυακές εφαρμογές τους με ομαλές κινούμενες εικόνες κύλισης που ενεργοποιούνται όταν τα στοιχεία εμφανίζονται στην οθόνη.
Το Sal είναι μια ελαφριά βιβλιοθήκη κινούμενων εικόνων κύλισης, με έμφαση στην απόδοση, που διευκολύνει την προσθήκη δυναμικών κινήσεων στα στοιχεία της ιστοσελίδας σας καθώς εισέρχονται στην περιοχή προβολής. Με μέγεθος πακέτου μικρότερο από 2.8 kb, λειτουργεί χωρίς εξαρτήσεις, προσφέροντας μια απρόσκοπτη εμπειρία χρήσης.
Βασίζεται στο Intersection Observer API, το οποίο επιτρέπει στο Sal να εντοπίζει αποτελεσματικά πότε τα στοιχεία είναι ορατά στην οθόνη και να ενεργοποιεί τις αντίστοιχες κινήσεις. Αυτό το API συμβάλλει στη βέλτιστη απόδοση, μειώνοντας σημαντικά το πρόσθετο κόστος της παρακολούθησης συμβάντων κύλισης.
Η ενσωμάτωση είναι απλή: προσθέτοντας το χαρακτηριστικό `data-sal` στα στοιχεία HTML, οι προγραμματιστές μπορούν να ορίσουν το επιθυμητό εφέ κίνησης. Οι επιλογές διάρκειας, καθυστέρησης και επιτάχυνσης μπορούν να προσαρμοστούν με πρόσθετα χαρακτηριστικά δεδομένων ή μεταβλητές CSS, προσφέροντας πλήρη έλεγχο της συμπεριφοράς της κίνησης. Στις υποστηριζόμενες κινήσεις περιλαμβάνονται εφέ όπως fade, slide, zoom και flip, μεταξύ άλλων.
Το Sal προσφέρει επίσης προηγμένες δυνατότητες, όπως την τροποποίηση επιλογών μετά την αρχικοποίηση, επιτρέποντας την προσαρμογή ανάλογα με την αλληλεπίδραση του χρήστη. Υποστηρίζει ακροατές συμβάντων για την ανίχνευση της εισόδου ή εξόδου στοιχείων από την περιοχή προβολής, γι' αυτό είναι κατάλληλο για διαδραστικές εφαρμογές που απαιτούν άμεση ανταπόκριση στη δραστηριότητα κύλισης του χρήστη.
Δυνατότητες
- Ελαφρύ (λιγότερο από 2.8 kb)
- Χωρίς εξαρτήσεις
- Κινήσεις κύλισης όταν τα στοιχεία είναι ορατά
- Βασίζεται στο Intersection Observer API
- Εύκολη ενσωμάτωση με HTML
- Υποστηρίζει πολλαπλά εφέ κίνησης
- Προσαρμόσιμες επιλογές διάρκειας, καθυστέρησης και επιτάχυνσης
- Συμβάντα εισόδου και εξόδου από την περιοχή προβολής
- Υποστηρίζει μεταβλητές CSS για προσαρμοσμένες ιδιότητες
- Δυνατότητα επαναφοράς και ενημέρωσης των επιλογών μετά την αρχικοποίηση
Σχετικά στοιχεία
Αυτή η βιβλιοθήκη κινουμένων σχεδίων απλοποιεί τη δημιουργία εντυπωσιακών animations για διαδικτυακές εφαρμογές, συνδυάζοντας ευελιξία και ευκολία χρήσης.
- Αστέρια στο GitHub
- 50.5K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Αυτό το εργαλείο κινούμενων σχεδίων σάς επιτρέπει να δημιουργείτε εύκολα ελκυστικά κινούμενα σχέδια και αλληλεπιδράσεις στον ιστό, βελτιώνοντας την εμπειρία χρήστη πέρα από τις τυπικές μεταβάσεις.
- Αστέρια στο GitHub
- 20.0K
- Ενημερώθηκε στις
- Dec 6, 2024
Μια σύγχρονη βιβλιοθήκη κινούμενων γραφικών για τον ιστό, βασισμένη σε εγγενή API του προγράμματος περιήγησης, που εξασφαλίζει υψηλή ταχύτητα και μικρό μέγεθος αρχείων.
- Αστέρια στο GitHub
- 26.1K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Αυτή η λύση κινουμένων σχεδίων προσφέρει ομαλές μεταβάσεις υψηλής απόδοσης που δίνουν ζωή σε κάθε διεπαφή και βελτιώνουν απρόσκοπτα την εμπειρία χρήστη.
- Αστέρια στο GitHub
- 28.3K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Προσθέστε εύκολα εντυπωσιακές κινούμενες εικόνες στις διαδικτυακές εφαρμογές σας.
- Αστέρια στο GitHub
- 12.9K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Ένα ισχυρό εργαλείο για τη δημιουργία εντυπωσιακών κινούμενων σχεδίων με ελάχιστη προσπάθεια στις εφαρμογές React.
- Αστέρια στο GitHub
- 26.1K
- Ενημερώθηκε στις
- Dec 6, 2024
- Άδεια χρήσης
- MIT License
Ένα framework κινούμενων σχεδίων βασισμένο σε βοηθητικές κλάσεις και στο GSAP, για τη δημιουργία κινούμενων σχεδίων με ελάχιστο κώδικα.
- Αστέρια στο GitHub
- 414
- Ενημερώθηκε στις
- Dec 2, 2024
- Άδεια χρήσης
- Other