Αρχική σελίδα » UI / UX » Αυτή η σελίδα GitHub παραθέτει εναλλακτικές λύσεις εκτός JS για κοινά χαρακτηριστικά UI

    Αυτή η σελίδα GitHub παραθέτει εναλλακτικές λύσεις εκτός JS για κοινά χαρακτηριστικά UI

    Πόσες φορές θέλατε να δημιουργήσετε ένα γρήγορο παράθυρο διαφανειών προβολής CSS ή ένα παράθυρο στυλ? Αυτά είναι μερικά από αυτά τα πιο κοινά στοιχεία UI στον ιστό και σήμερα μπορείτε να τα δημιουργήσετε χωρίς JavaScript.

    Σίγουρα, είναι δυνατό να χτυπήσετε Google αναζητώντας λύσεις. Μα γιατί όχι επιλέξτε από μια επιμελημένη λίστα από φοβερούς πόρους?

    Εκεί βρίσκεται αυτή η σελίδα GitHub. Έχει τίτλο "Δεν χρειάζεστε JavaScript", και προσφέρει μια τεράστια λίστα με λειτουργικές λύσεις για κοινά στοιχεία διεπαφής.

    Ένα πράγμα που πρέπει να σημειωθεί είναι ότι αυτοί οι κώδικες είναι όχι τελικές λύσεις.

    Δεν είναι όλα στη λίστα που υποστηρίζει όλα τα προγράμματα περιήγησης και πολλές από αυτές τις λύσεις δεν είναι πλήρως σε θέση να χειριστούν χαλαρή υποβάθμιση ή προβλήματα με τα προγράμματα περιήγησης για κινητά. Θα χρειαστεί κάθε ένα ξεχωριστά κατά περίπτωση.

    Ωστόσο, εάν πεθάνετε καθαρή CSS λύσεις τότε αυτό το GitHub σας καλύπτει.

    Η λίστα εμφανίζεται πάνω 20 διαφορετικά στοιχεία UI με πολλές εξέχουσες λύσεις, όπως:

    • Μενού Hamburger
    • Εργαλεία
    • Καρτέλες
    • Γκαλερί εικόνων
    • Μενού με διαλείμματα
    • Και πολλά άλλα.

    Κάθε έργο συνδέει ένα demo του CodePen όπου μπορείς δείτε το ζωντανό μαζί με δείγμα πηγαίου κώδικα.

    Σημειώστε αυτό το συγκεκριμένο GitHub repo δεν έχει πραγματικό κωδικό μέσα σε αυτό. Μάλλον είναι απλά μια λίστα με τα demo του CodePen που χαρακτηρίζει μη-JS λύσεις σε κοινά προβλήματα διεπαφής.

    Αυτός είναι ο ιδανικός πόρος για το σελιδοδείκτη για μελλοντική αναφορά και να διατηρείται κοντά εάν χρειάζεται.

    Είστε ελεύθεροι να συνεισφέρετε επικοινωνώντας με κάποιον από το κύρια σελίδα GitHub εάν έχετε ιδέες ή προτάσεις για νέους πόρους.

    Είστε ελεύθεροι να αντιγράψτε οποιοδήποτε πηγαίο κώδικα από οποιοδήποτε από αυτά τα demos και επαναχρησιμοποιήστε τα στα έργα σας.

    Απλά βεβαιωθείτε ότι ελέγχετε την καρτέλα ιδιοτήτων CSS πριν αντιγράψετε τίποτα επειδή μερικοί περιέχουν επιπλέον βιβλιοθήκες.

    Συνολικά, αυτό είναι ένα φανταστικό repo GitHub και είναι πολύ πιο εύκολο στη χρήση από το Google που ψάχνει για αυτή την τέλεια λύση.

    Ελεγξε το πλήρη σελίδα GitHub εδώ, και αν θέλετε δείτε όλες τις πιθανές αλλαγές μπορείτε να δείτε αυτούς στο pull tab.