Web Development • 4 λεπτά ανάγνωση 12 Καρουζέλ Φτιαγμένα με Δημοφιλή Πρόσθετα JavaScript Posted by Γιώργος 25 Μαΐου, 2024 Τα καρουζέλ είναι ένα δημοφιλές στοιχείο που χρησιμοποιείται σε πολλές ιστοσελίδες. Θα τα βρεις συχνότερα στην αρχική σελίδα ενός ιστότοπου. Υπάρχουν σπουδαίες βιβλιοθήκες JavaScript που μπορούν να μας βοηθήσουν να δημιουργήσουμε ελκυστικά καρουζέλ. Σε αυτό το άρθρο, θα ελέγξουμε διάφορες βιβλιοθήκες που η Double Dot έχει χρησιμοποιήσει στο παρελθόν ως μέρος ενός προσαρμοσμένου θέματος WordPress για να παράγει την επιθυμητή λειτουργικότητα. UIkit Όπως έχουμε συζητήσει σε προηγούμενο άρθρο, μας αρέσει πολύ το UIkit και στην Double Dot το χρησιμοποιούμε από την έκδοση v2. Έτσι, έχουμε κατασκευάσει πολλά slideshows, τόσο απλά όσο και πιο σύνθετα, εκμεταλλευόμενοι τα Slideshow και Slider components. Δείτε παρακάτω μερικά από αυτά τα παραδείγματα: ouranosmy.com samossteamship.gr roussakis.com.gr verinahotelsifnos.com Swiper Το Swiper είναι μια από τις πιο δημοφιλείς βιβλιοθήκες JavaScript που μπορεί να χρησιμοποιηθεί είτε ως αυτόνομο πρόσθετο JavaScript είτε ως μέρος ενός JavaScript framework (π.χ. React). Παρακάτω ένα πρόσφατο έργο όπου εκμεταλλευτήκαμε αυτή την εξαιρετική βιβλιοθήκη και δημιουργήσαμε διαφορετικά layouts: deloudis.gr Owl Carousel Το Owl Carousel είναι ένα jQuery πρόσθετο με δυνατότητα αφής που σας επιτρέπει να δημιουργήσετε όμορφα responsive sliders καρουζέλ. Ακολουθούν μερικοί ιστότοποι στους οποίους το έχουμε χρησιμοποιήσει: omiros.gr aegeancollege.gr bend.gr dolce.pub Slick Το Slick είναι ένα άλλο δημοφιλές slider του jQuery. Ένα από τα πιο χρήσιμα χαρακτηριστικά του (`asNavFor`) είναι η δυνατότητα συγχρονισμού δύο διαφορετικών καρουζέλ. Εδώ είναι μια ιστοσελίδα όπου κάνουμε χρήση αυτής της δυνατότητας: deadpoets.live Και εδώ είναι άλλα δύο παραδείγματα με ενσωμάτωση Slick: timafoundation.org lawspace.gr Ανακεφαλαιώνοντας Αυτά είναι μόνο μερικά πραγματικά παραδείγματα που κατασκευάστηκαν με διαφορετικά καρουζέλ JavaScript. Λίγο-πολύ, η ιδέα πίσω από τα καρουζέλ παραμένει η ίδια. Αυτό που έχει σημασία ανάλογα με τις ανάγκες του έργου είναι οι επιλογές (events, μέθοδοι, δομή, κ.λπ.) που προσφέρει κάθε καρουζέλ. Tags Owl Carousel Slick Swiper UIkit Share if you like! Related Posts Posted by Γιώργος 27 Φεβρουαρίου, 2024 Web Development • 4 λεπτά ανάγνωση UIkit: Ένα framework για τη γρήγορη ανάπτυξη layouts Περισσότερα Posted by Παναγιώτης 13 Απριλίου, 2024 Web Development • 11 λεπτά ανάγνωση Web Development: Χρήση των Laravel, Vue.js, Nuxt.js, GraphQL, Apollo & Tailwind CSS Περισσότερα Posted by Δημήτρης 2 Σεπτεμβρίου, 2024 Web Development • 7 λεπτά ανάγνωση Ενίσχυσε το site σου με την δύναμη του wp-config.php Περισσότερα
Posted by Γιώργος 27 Φεβρουαρίου, 2024 Web Development • 4 λεπτά ανάγνωση UIkit: Ένα framework για τη γρήγορη ανάπτυξη layouts Περισσότερα
Posted by Παναγιώτης 13 Απριλίου, 2024 Web Development • 11 λεπτά ανάγνωση Web Development: Χρήση των Laravel, Vue.js, Nuxt.js, GraphQL, Apollo & Tailwind CSS Περισσότερα
Posted by Δημήτρης 2 Σεπτεμβρίου, 2024 Web Development • 7 λεπτά ανάγνωση Ενίσχυσε το site σου με την δύναμη του wp-config.php Περισσότερα