Αποκριτικό ρυθμιστικό χρησιμοποιώντας jQuery. Slider Pro - προσαρμοστικό ρυθμιστικό με μικρογραφίες Μεγάλο ρυθμιστικό με περιγραφή

Η προσαρμοστική ή αν προτιμάτε η responsive σχεδίαση ιστοσελίδων δεν είναι πλέον απλώς μια άλλη σχεδιαστική τάση, είναι ήδη ένα ορισμένο πρότυπο για την ανάπτυξη ιστοσελίδων, διασφαλίζοντας την ευελιξία των ιστοσελίδων και την αρμονική οπτική αντίληψη στις οθόνες διαφόρων συσκευών χρηστών. Πιο πρόσφατα, κατά την ανάπτυξη ενός αποκριτικού προτύπου, έπρεπε να αντιμετωπίσω διάφορες δυσκολίες στην ενσωμάτωση ορισμένων ρυθμιστικών και γκαλερί εικόνων χωρίς να διαταραχθεί το συνολικό στυλ σχεδίασης. Στις μέρες μας όλα είναι πολύ πιο απλά, υπάρχει ένας τεράστιος αριθμός έτοιμων λύσεων στο Διαδίκτυο και αυτό που είναι ιδιαίτερα ευχάριστο είναι ότι οι περισσότερες από αυτές είναι ελεύθερα διαθέσιμες, ανοιχτού κώδικα.

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

WOW Slider

Αποκριτικό ρυθμιστικό εικόνας jQuery με ένα υπέροχο σύνολο οπτικών εφέ (περιστροφή, διαφυγή, θάμπωμα, σπείρες, περσίδες, κ.λπ...) και πολλά έτοιμα πρότυπα. Με τον ενσωματωμένο οδηγό εισαγωγής σελίδας του WOW Slider, μπορείτε εύκολα και αβίαστα να δημιουργήσετε εκπληκτικές παρουσιάσεις διαφανειών μέσα σε λίγα λεπτά. Ο ιστότοπος του προγραμματιστή περιέχει όλη την απαραίτητη τεκμηρίωση για τη ρύθμιση και τη χρήση της προσθήκης στα ρωσικά, καθώς και εξαιρετικά ζωντανά παραδείγματα για το πώς λειτουργεί η προσθήκη. Ένα ξεχωριστό πρόσθετο Wordpress και μια ενότητα για το Joomla είναι επίσης διαθέσιμα για λήψη. Είμαι σίγουρος ότι θα αρέσει σε πολλούς αυτό το υπέροχο ρυθμιστικό, τόσο στους αρχάριους όσο και στους έμπειρους webmasters.

HiSlider

HiSlider - HTML5, ρυθμιστικό Jquery και συλλογή εικόνων, εντελώς δωρεάν πρόσθετο για προσωπική χρήση σε ιστότοπους που εκτελούν δημοφιλή συστήματα - WordPress, Joomla, Drupal. Με τη βοήθεια αυτού του απλού αλλά αρκετά λειτουργικού εργαλείου, μπορείτε εύκολα να δημιουργήσετε εκπληκτικά και ζωντανά slide shows, θεαματικές παρουσιάσεις και ανακοινώσεις νέων μηνυμάτων στις σελίδες των ιστοσελίδων σας. Πολλά έτοιμα πρότυπα και skins για το slider, εκπληκτικά εφέ μετάβασης (αλλαγής) περιεχομένου, έξοδος διαφόρων πολυμέσων περιεχομένου: βίντεο από το YouTube και το Vimeo, ευέλικτες ρυθμίσεις χρήστη κ.λπ.

Nivo Slider

Το Nivo Slider είναι ένα παλιό καλό, γνωστό σε όλους τους γνωστούς, ένα από τα πιο όμορφα και εύχρηστα ρυθμιστικά εικόνας. Το πρόσθετο JQuery Nivo Slider είναι δωρεάν για λήψη και χρήση και διαθέτει άδεια χρήσης βάσει της άδειας MIT. Υπάρχει επίσης ένα ξεχωριστό πρόσθετο για το WordPress, αλλά δυστυχώς είναι ήδη πληρωμένο και θα πρέπει να πληρώσετε 29 $ για μία άδεια. Είναι καλύτερα να κάνετε λίγη μαγεία με τα αρχεία θέματος WP και να επισυνάψετε τη δωρεάν έκδοση jQuery της προσθήκης Nivo Slider στο ιστολόγιό σας, καθώς υπάρχουν πολλές πληροφορίες για το πώς να το κάνετε αυτό στο Διαδίκτυο.
Όσο για τη λειτουργικότητα, όλα είναι καλά με αυτό. Χρησιμοποιεί τη βιβλιοθήκη jQuery v1.7+, όμορφα εφέ μετάβασης, απλές και πολύ ευέλικτες ρυθμίσεις, προσαρμοστική διάταξη, αυτόματη περικοπή εικόνας και πολλά άλλα.

Η ιδέα του ρυθμιστικού εμπνεύστηκε από τους προγραμματιστές, οι οποίοι είναι γνωστοί για το στυλ παρουσίασης των προϊόντων της Apple, όπου πολλά μικρά αντικείμενα (εικόνες) αλλάζουν κάνοντας κλικ στην επιλεγμένη κατηγορία με ένα απλό εφέ κίνησης. Το Codrops παρουσιάζει στη διάθεσή σας ένα λεπτομερές σεμινάριο για το πώς να δημιουργήσετε αυτό το ρυθμιστικό, μια πλήρη διάταξη της σήμανσης Html, ένα σύνολο κανόνων CSS και ένα εκτελέσιμο πρόσθετο jQuery, καθώς και ένα υπέροχο ζωντανό παράδειγμα χρήσης του ρυθμιστικού.

Slit Slider

Ρυθμιστικό εικόνας πλήρους οθόνης με χρήση JQuery και CSS3 + λεπτομερές σεμινάριο για την ενσωμάτωση της προσθήκης σε σελίδες ιστότοπου. Η ιδέα είναι να τεμαχίσετε την ανοιχτή τρέχουσα διαφάνεια με συγκεκριμένο περιεχόμενο κατά τη μετάβαση στο επόμενο ή προηγούμενο περιεχόμενο. Χρησιμοποιώντας κινούμενα σχέδια JQuery και CSS, μπορείτε να δημιουργήσετε μοναδικές μεταβάσεις μεταξύ διαφανειών. Η απόκριση διάταξη του ρυθμιστικού διασφαλίζει ότι φαίνεται εξίσου καλή σε διαφορετικούς τύπους συσκευών χρήστη.

Ελαστικό ρυθμιστικό περιεχομένου

Ένα ρυθμιστικό περιεχομένου που προσαρμόζεται αυτόματα σε πλάτος και ύψος ανάλογα με το μέγεθος του γονικού κοντέινερ στο οποίο βρίσκεται. Αρκετά απλό στην εφαρμογή και ευέλικτο στις ρυθμίσεις, το ρυθμιστικό εκτελείται στο JQuery, με πλοήγηση στο κάτω μέρος, όταν το μέγεθος της οθόνης αλλάζει προς τα κάτω, η πλοήγηση εμφανίζεται με τη μορφή εικονιδίων. Πολύ αναλυτική τεκμηρίωση (εκμάθηση δημιουργίας) και ζωντανά παραδείγματα χρήσης.

3D Stack Slider

Μια πειραματική έκδοση του ρυθμιστικού που δείχνει εικόνες με μεταβάσεις από το τρισδιάστατο επίπεδο. Οι εικόνες χωρίζονται σε δύο οριζόντιες στοίβες, χρησιμοποιώντας τα βέλη πλοήγησης για αλλαγή και μετάβαση κάθε επόμενης εικόνας στην κατάσταση προβολής. Γενικά, τίποτα το ιδιαίτερο, αλλά η ίδια η ιδέα και η τεχνική εκτέλεσης είναι αρκετά ενδιαφέρουσες.

Ένα πολύ απλό ρυθμιστικό εικόνας jQuery με 100% απόκριση και πλήρη οθόνη. Η εργασία του ρυθμιστικού βασίζεται σε μεταβάσεις CSS (η ιδιότητα μετάβασης) σε συνδυασμό με τη μαγεία του jQuery. Η τιμή μέγιστου πλάτους έχει οριστεί στο 100% από προεπιλογή, επομένως το μέγεθος των εικόνων θα αλλάξει ανάλογα με τις αλλαγές στο μέγεθος της οθόνης. Δεν υπάρχουν ειδικά εφέ κινουμένων σχεδίων ή διακοσμητικά στοιχεία στο σχεδιασμό, όλα είναι απλά και σχεδιασμένα για απρόσκοπτη λειτουργία.

Ελάχιστες διαφάνειες

Το όνομα μιλάει από μόνο του, αυτό είναι ίσως ένα από τα πιο ελαφριά και μινιμαλιστικά ρυθμιστικά εικόνας jQuery που έχω συναντήσει (πρόσθετο 1kb). ResponsiveSlides.jsείναι ένα μικροσκοπικό πρόσθετο jQuery που δημιουργεί μια παρουσίαση χρησιμοποιώντας στοιχεία μέσα σε ένα κοντέινερ. Λειτουργεί με ένα ευρύ φάσμα προγραμμάτων περιήγησης, συμπεριλαμβανομένων όλων των εκδόσεων του IE - το διάσημο φρένο στην πρόοδο, από IE6 και νεότερες εκδόσεις. Η εργασία χρησιμοποιεί μεταβάσεις CSS3 σε συνδυασμό με javascript για αξιοπιστία. Απλή διάταξη με χρήση λίστας χωρίς σειρά, προσαρμογή μεταβάσεων και χρονικών διαστημάτων, αυτόματος και χειροκίνητος έλεγχος της εναλλαγής διαφανειών, καθώς και υποστήριξη για πολλαπλές παρουσιάσεις ταυτόχρονα. Αυτό είναι ένα τόσο παιχνιδιάρικο «μωρό».

ΦΩΤΟΓΡΑΦΙΚΗ ΜΗΧΑΝΗ

Το Camera είναι ένα δωρεάν πρόσθετο JQuery για την οργάνωση προβολών διαφανειών σε σελίδες ιστότοπων, ένα ελαφρύ ρυθμιστικό με πολλά εφέ μετάβασης, μια διάταξη που ανταποκρίνεται 100% και πολύ απλές ρυθμίσεις. Ταιριάζει τέλεια στις οθόνες οποιασδήποτε συσκευής χρήστη (οθόνες υπολογιστή, tablet, smartphone και κινητά τηλέφωνα). Δυνατότητα επίδειξης ενσωματωμένου βίντεο. Αυτόματη αλλαγή διαφανειών και χειροκίνητος έλεγχος με χρήση κουμπιών και μπλοκ μικρογραφιών εικόνας. Μια σχεδόν πλήρης συλλογή εικόνων σε συμπαγή σχεδιασμό.

bxSlider jQuery

Ένα άλλο αρκετά απλό ρυθμιστικό με απόκριση στο jQuery. Μπορείτε να τοποθετήσετε οποιοδήποτε περιεχόμενο, βίντεο, εικόνες, κείμενο και άλλα στοιχεία στις διαφάνειές σας. Διευρυμένη υποστήριξη για οθόνες αφής. Χρήση κινούμενων εικόνων μετάβασης CSS. Ένας μεγάλος αριθμός διαφορετικών παραλλαγών προβολών διαφανειών και συμπαγών γκαλερί εικόνων. Αυτόματος και χειροκίνητος έλεγχος. Αλλάξτε τις διαφάνειες χρησιμοποιώντας κουμπιά και επιλέγοντας μικρογραφίες. Μικρό μέγεθος αρχείου προέλευσης, πολύ εύκολο στη διαμόρφωση και την εφαρμογή.

FlexSlider 2

FlexSlider 2 - Μια ενημερωμένη έκδοση του ομώνυμου ρυθμιστικού, με βελτιωμένη απόκριση, ελαχιστοποίηση του σεναρίου και ελαχιστοποίηση της εκ νέου ροής/επανασχεδίασης. Το πρόσθετο περιλαμβάνει ένα βασικό ρυθμιστικό, έλεγχο διαφανειών με μικρογραφίες, ενσωματωμένα βέλη αριστερά-δεξιά και μια κάτω γραμμή πλοήγησης με τη μορφή κουμπιών. Δυνατότητα προβολής βίντεο σε διαφάνειες (vimeo), ευέλικτες ρυθμίσεις (μεταβάσεις, σχεδιασμός, χρονικό διάστημα), πλήρως προσαρμοστική διάταξη.

Galleria

Ένα πολύ γνωστό και αρκετά δημοφιλές responsive πρόσθετο jQuery για τη δημιουργία γκαλερί εικόνων και ρυθμιστικών υψηλής ποιότητας. Η διεπαφή του ρυθμιστικού, χάρη στον πίνακα ελέγχου του, μοιάζει οπτικά με ένα οικείο πρόγραμμα αναπαραγωγής βίντεο, το πρόσθετο περιλαμβάνει πολλά διαφορετικά θέματα σχεδίασης. Υποστήριξη για ενσωματωμένα βίντεο και εικόνες από δημοφιλείς υπηρεσίες: Flickr, Vimeo, YouTube και άλλες. Λεπτομερής τεκμηρίωση για τη ρύθμιση και τη χρήση.

Μυρτιλός

Ένα απλό, δωρεάν ρυθμιστικό εικόνας jQuery γραμμένο ειδικά για αποκριτικό σχεδιασμό ιστοσελίδων. Το Blueberry είναι ένα πειραματικό πρόσθετο jQuery ανοιχτού κώδικα. Μινιμαλιστικός σχεδιασμός, χωρίς εφέ, μόνο ομαλά αναδυόμενες εικόνες που αντικαθιστούν η μία την άλλη μετά από ένα ορισμένο χρονικό διάστημα. Όλα είναι πολύ απλά, εγκαταστήστε, συνδεθείτε και πηγαίνετε...

jQuery popaye 2.1

Ένα πολύ συμπαγές ρυθμιστικό εικόνας jQuery με στοιχεία Lightbox. Χάρη στις ευέλικτες διαστάσεις του, είναι πολύ εύκολο να ενσωματωθεί σε οποιοδήποτε κοντέινερ, σε μία μόνο καταχώρηση με τη μορφή μικρογραφιών, όταν τοποθετείτε τον κέρσορα του ποντικιού ή κάνετε κλικ πάνω τους, ενεργοποιείται ένα lightbox με μεγεθυμένη εικόνα και χειριστήρια. Είναι βολικό να τοποθετήσετε ένα τέτοιο ρυθμιστικό στα πλαϊνά πάνελ για να παρουσιάσετε προϊόντα ή ανακοινώσεις ειδήσεων. Μια εξαιρετική λύση για ιστότοπους με μεγάλο όγκο πληροφοριών.

Αλληλουχία

Δωρεάν αποκριτικό ρυθμιστικό με προηγμένες μεταβάσεις CSS3. Μινιμαλιστικό στυλ, 3 θέματα σχεδίασης, Κάθε πλαίσιο ολισθαίνει οριζόντια, εμφανίζεται στο κέντρο, η εικόνα πηγαίνει προς τα αριστερά, η υπογραφή προς τα δεξιά, οι μικρογραφίες αντιγράφονται στην κάτω δεξιά γωνία. Σελιδοποίηση προβολών προϊόντων για προβολή σε κάθε πλαίσιο. Τα χειριστήρια περιλαμβάνουν επίσης κουμπιά πίσω και εμπρός. Υποστηρίζεται από όλα τα σύγχρονα προγράμματα περιήγησης.

Σουφρώνω

Ένα πολύ απλό ρυθμιστικό εικόνας τόσο από άποψη λειτουργικότητας όσο και από τις ρυθμίσεις, υπάρχει αλλαγή στην ταχύτητα αλλαγής διαφανειών, ενεργοποίηση της χειροκίνητης λειτουργίας (ενεργοποιούνται τα κουμπιά ελέγχου), η συνεχής προβολή διαφανειών. Αυτό το ρυθμιστικό έχει το δικαίωμα να υπάρχει και με τράβηξε μόνο επειδή υπάρχει δεν βρήκα κάτι ιδιαίτερα ενδιαφέρον σε αυτήν την εξέλιξη, ίσως δεν το έψαχνα καλά)))

Ρυθμιστικό εικόνας με απόκριση

Ένα τόσο όμορφο, προσαρμοστικό ρυθμιστικό εικόνας από τον Vladimir Kudinov, σύντροφοι. Ένα συμπαγές, καλά σχεδιασμένο εργαλείο, που παρέχεται με ενδεικτικά παραδείγματα και λεπτομερείς οδηγίες για τη δημιουργία, την εγκατάσταση και τη χρήση. Προσαρμοστικός σχεδιασμός, ωραία κουμπιά και πράσινα βέλη, όλα είναι αρκετά ωραία και ήρεμα, χωρίς πίεση.

FractionSlider

Δωρεάν πρόσθετο slider JQuery με εφέ parallax για εικόνες και διαφάνειες κειμένου. Τα κινούμενα σχέδια διαφανειών έχουν πολλαπλές τιμές εμφάνισης με πλήρη έλεγχο σε κάθε ρύθμιση χρονισμού και κίνησης. Η δυνατότητα κίνησης πολλών στοιχείων σε μια διαφάνεια ταυτόχρονα. Μπορείτε να ορίσετε διαφορετικές μεθόδους κινούμενης εικόνας, σβήσιμο διαφανειών ή μεταβάσεις από μια συγκεκριμένη κατεύθυνση. Αυτόματη εμφάνιση και χειροκίνητος έλεγχος χρησιμοποιώντας βέλη πλοήγησης που εμφανίζονται όταν τοποθετείτε το δείκτη του ποντικιού πάνω από την εικόνα. 10 είδη εφέ κινουμένων σχεδίων διαφανειών και πολλά άλλα...

Η αναθεώρηση αποδείχθηκε αρκετά εκτενής, αλλά όχι αρκετά ενημερωτική λόγω του μεγάλου αριθμού προϊόντων που εξετάστηκαν. Μπορείτε να μάθετε όλες τις λεπτομέρειες και λεπτομερείς περιγραφές της λειτουργικότητας ενός συγκεκριμένου πρόσθετου απευθείας στις σελίδες των προγραμματιστών. Μπορώ μόνο να ελπίζω ότι έχω διευκολύνει κάποιον να βρει αυτό το πολύ απαραίτητο εργαλείο για τη δημιουργία πολύχρωμων ρυθμιστικών εικόνων στις σελίδες των ιστοσελίδων του.

Έχετε σκεφτεί ποτέ ότι θα ήταν ωραίο να μπορέσετε να εργαστείτε με πρότυπα στη ρωσική γλώσσα; Σκεφτείτε το για ένα λεπτό. Δεν χάνετε χρόνο εργασίας με πρότυπα αγγλικής γλώσσας. Σπεύδουμε να σας ευχαριστήσουμε που μπορείτε πλέον να το βρείτε στην αγορά TemplateMonster. Το κείμενο για καθένα από αυτά γράφτηκε στο χέρι. Και, φυσικά, όλες οι έτοιμες λύσεις είναι απίστευτα εύχρηστες.

Με όλο τον σεβασμό, Andrew

Ο χρόνος δεν σταματά και μαζί του και η πρόοδος. Αυτό επηρέασε και το Διαδίκτυο. Μπορείτε ήδη να δείτε πώς αλλάζει η εμφάνιση των ιστοσελίδων, η προσαρμοστική σχεδίαση είναι ιδιαίτερα δημοφιλής. Και από αυτή την άποψη, έχουν εμφανιστεί αρκετά νέα προσαρμοστικά ρυθμιστικά jquery, γκαλερί, καρουζέλ ή παρόμοια πρόσθετα.
1. Ρυθμιστικό Responsive Horizontal Posts

Προσαρμοστικό οριζόντιο καρουζέλ με αναλυτικές οδηγίες τοποθέτησης. Είναι φτιαγμένο σε απλό στυλ, αλλά μπορείτε να το διαμορφώσετε ώστε να ταιριάζει στον εαυτό σας.

2. Ρυθμιστικό στο Glide.js

Αυτό το ρυθμιστικό είναι κατάλληλο για κάθε ιστότοπο. Χρησιμοποιεί ανοιχτού κώδικα Glide.js. Τα χρώματα του ρυθμιστικού μπορούν εύκολα να αλλάξουν.

3. Παρουσίαση με κλίση περιεχομένου

Αποκριτικό ρυθμιστικό περιεχομένου. Το αποκορύφωμα αυτού του ρυθμιστικού είναι το 3D εφέ των εικόνων, καθώς και διαφορετικά κινούμενα σχέδια τυχαίας εμφάνισης.

4. Ρυθμιστικό χρησιμοποιώντας καμβά HTML5

Ένα πολύ όμορφο και εντυπωσιακό ρυθμιστικό με διαδραστικά σωματίδια. Κατασκευάστηκε χρησιμοποιώντας καμβά HTML5,

5. Ρυθμιστικό μορφοποίησης εικόνας

Ρυθμιστικό με εφέ μορφοποίησης (Ομαλή μετατροπή από ένα αντικείμενο σε άλλο). Σε αυτό το παράδειγμα, το ρυθμιστικό είναι κατάλληλο για το χαρτοφυλάκιο ενός προγραμματιστή ιστού ή στούντιο ιστού με τη μορφή χαρτοφυλακίου.

6. Κυκλικό ρυθμιστικό

Ρυθμιστικό σε μορφή κύκλου με εφέ αναστροφής της εικόνας.

7. Ρυθμιστικό με θολό φόντο

Προσαρμοστικό ρυθμιστικό με εναλλαγή και θόλωση φόντου.

8. Αποκριτικό ρυθμιστικό μόδας

Απλό, ελαφρύ και ανταποκρινόμενο ρυθμιστικό ιστότοπου.

9. Slicebox - jQuery 3D ρυθμιστικό εικόνας(ΕΠΙΚΑΙΡΟΠΟΙΗΜΕΝΟ)

Ενημερωμένη έκδοση του ρυθμιστικού Slicebox με διορθώσεις και νέες δυνατότητες.

10.Δωρεάν κινούμενο πλέγμα απόκρισης εικόνας

Πρόσθετο JQuery για τη δημιουργία ενός ευέλικτου πλέγματος εικόνων που θα αλλάζει λήψεις χρησιμοποιώντας διαφορετικά κινούμενα σχέδια και χρονισμούς. Αυτό μπορεί να φαίνεται καλό ως φόντο ή διακοσμητικό στοιχείο σε έναν ιστότοπο, καθώς μπορούμε να εμφανίσουμε επιλεκτικά νέες εικόνες και τις μεταβάσεις τους. Το πρόσθετο διατίθεται σε διάφορες εκδόσεις.

11.Ρυθμιστικό Flex

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

12. Κορνίζα

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

ΥΣΤΕΡΟΓΡΑΦΟ.Τοποθέτησα το ρυθμιστικό αρκετές φορές και νομίζω ότι είναι από τα καλύτερα

13. Δωρεάν και προσαρμοστική 3D slider gallery με μικρογραφίες.

Πειραματικό ρυθμιστικό συλλογής 3DPanelLayoutμε πλέγμα και ενδιαφέροντα εφέ κινουμένων σχεδίων.

14. Ρυθμιστικό χρησιμοποιώντας css3

Το προσαρμοστικό ρυθμιστικό είναι κατασκευασμένο με χρήση css3 με ομαλή εμφάνιση περιεχομένου και ελαφριά κινούμενη εικόνα.

15. WOW Slider

WOW Sliderείναι ένα ρυθμιστικό εικόνας με εκπληκτικά οπτικά εφέ.

17. Ελαστικό

Ελαστικό ρυθμιστικό με πλήρη απόκριση και μικρογραφίες διαφανειών.

18. Σχισμή

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

19. Adaptive photo gallery plus

Ένα απλό δωρεάν ρυθμιστικό συλλογής με φόρτωση εικόνας.

20. Responsive Slider για WordPress

Προσαρμοστικό δωρεάν ρυθμιστικό για WP.

21. Parallax Content Slider

Ρυθμιστικό με εφέ παράλλαξης και έλεγχο κάθε στοιχείου με χρήση CSS3.

22. Ρυθμιστικό με σύνδεσμο μουσικής

Ρυθμιστικό χρησιμοποιώντας τον ανοιχτό κώδικα JPlayer. Αυτό το ρυθμιστικό μοιάζει με παρουσίαση με μουσική.

23. Ρυθμιστικό με jmpress.js

Το ρυθμιστικό με απόκριση βασίζεται στο jmpress.js και επομένως θα σας επιτρέψει να προσθέσετε μερικά ενδιαφέροντα τρισδιάστατα εφέ στις διαφάνειές σας.

24. Fast Hover Slideshow

Παρουσίαση διαφανειών με γρήγορη εναλλαγή διαφανειών. Διακόπτης διαφανειών σε λειτουργία αιώρησης.

25. Ακορντεόν εικόνας με CSS3

Ακορντεόν εικόνων με χρήση css3.

26. Προσθήκη βελτιστοποιημένης συλλογής με άγγιγμα

Αυτή είναι μια αποκριτική συλλογή που είναι βελτιστοποιημένη για συσκευές αφής.

27. Γκαλερί 3D

3D Wall Gallery- δημιουργήθηκε για το πρόγραμμα περιήγησης Safari, όπου θα είναι ορατό το 3D εφέ. Εάν το δείτε σε άλλο πρόγραμμα περιήγησης, η λειτουργικότητα θα είναι καλή, αλλά το εφέ 3D δεν θα είναι ορατό.

28. Ρυθμιστικό με σελιδοποίηση

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

29.Μοντάζ εικόνας με jQuery

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

30. Γκαλερί 3D

Ένα απλό τρισδιάστατο κυκλικό ρυθμιστικό που χρησιμοποιεί css3 και jQuery.

31. Λειτουργία πλήρους οθόνης με εφέ 3D με χρήση css3 και jQuery

Ένα ρυθμιστικό με δυνατότητα προβολής εικόνων πλήρους οθόνης με όμορφη μετάβαση.

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

Αυτή είναι μια από τις πιο δημοφιλείς τάσεις στον σχεδιασμό ιστοσελίδων τα τελευταία χρόνια. Επιπλέον, η χρήση έτοιμων βιβλιοθηκών και πρόσθετων jQuery μπορεί να εξοικονομήσει σημαντικά χρόνο. Το μόνο που χρειάζεται να κάνετε είναι να παράσχετε έναν σύνδεσμο προς τα αρχεία JavaScript και CSS και, στη συνέχεια, να εφαρμόσετε το εφέ στα επιθυμητά στοιχεία HTML.

Μπορείτε επίσης να ορίσετε τις δικές σας ρυθμίσεις και στυλ CSS. Το σημερινό άρθρο έχει ως στόχο να σας παρουσιάσει προσθήκες απόκρισης jQuery για τη δημιουργία καρουζέλ και ρυθμιστικών.

Αποσπά την προσοχή – πρόσθετο jQuery για τη δημιουργία ενός ρυθμιστικού περιεχομένου πλήρους οθόνης με ευαισθησία στην αφή

Αποκριτικό ρυθμιστικό καρουζέλ περιεχομένου jQuery σε πλήρη οθόνη με υποστήριξη οθόνης αφής. Το πρόσθετο διανέμεται υπό την GNU GENERAL PUBLIC LICENSE v3:

Neoslide: ένα απλό και επεκτάσιμο πρόσθετο καρουζέλ jQuery

Ένα απλό και επεκτάσιμο πρόσθετο jQuery που θα σας επιτρέψει να χρησιμοποιήσετε ένα πλήρως προσαρμόσιμο ρυθμιστικό σε οποιαδήποτε ιστοσελίδα:

Hslider: πρόσθετο γκαλερί εικόνων με απόκριση πλήρους πλάτους

Ένα άλλο πρόσθετο για την εμφάνιση εικόνων χρησιμοποιώντας ένα αποκριτικό καρουζέλ jQuery με χειριστήρια και προσαρμοσμένη διάρκεια καθυστέρησης:

Carousel 3D: πρόσθετο καρουζέλ jQuery με εφέ περιστροφής 3D

Sleek Slider: jQuery Carousel με απόκριση σε πλήρη οθόνη

Μινιατούρα και ελκυστικό καρουζέλ jQuery για προβολή περιεχομένου και εικόνων με διαφορετικούς τύπους πλοήγησης ( Βέλη SVG με μικρογραφίες εικόνων, στοιχεία σελιδοποίησης ή καρτέλες):

PaW Carousel: Responsive Carousel Powered by jQuery

Το PaW Carousel (v2) είναι ένα μικροσκοπικό πρόσθετο για τη δημιουργία ανταποκρινόμενων, απλών καρουζέλ jQuery με μικρογραφίες εικόνων:

Carousel Sharer: jQuery carousel για αναδημοσίευση στα κοινωνικά δίκτυα

Το Carousel Sharer είναι μια προσθήκη jQuery που σας επιτρέπει να εμφανίζετε πολλά προϊόντα στη σειρά και επιτρέπει στους επισκέπτες να μοιράζονται τα προϊόντα σας στο Facebook, το Twitter, το Google+ και το Pinterest:

Simply Carousel: ένα μινιμαλιστικό καρουσέλ εικόνας με απόκριση

Το Simply Carousel είναι ένα μικρό και γρήγορο πρόσθετο jQuery που σας επιτρέπει να δημιουργείτε ευέλικτα ρυθμιστικά εικόνας και καρουζέλ με απόκριση:

Slides: Responsive jQuery carousel και slideshow με υποστήριξη αφής

Το Slides είναι ένα μικροσκοπικό πρόσθετο jQuery για τη δημιουργία αποκριτικών καρουζέλ για έναν ιστότοπο jQuery με μικρογραφίες, πλοήγηση με βέλη και δυνατότητα χρήσης προσαρμοσμένων στοιχείων ελέγχου. Έχει υλοποιηθεί υποστήριξη για οθόνες αφής:

Καρουζέλ περιεχομένου jQuery

Ένα απλό καρουζέλ jQuery με απόκριση με δυνατότητες αυτόματης αναπαραγωγής, χειριστήρια και ακόμη και λειτουργίες επανάκλησης:

Slick: Αποκριτικό και ευέλικτο καρουζέλ jQuery

Το Slick είναι μια "φρέσκια" προσθήκη για τη δημιουργία προσαρμοσμένων, αποκρινόμενων και βελτιστοποιημένων για κινητά καρουζέλ και ρυθμιστικών jQuery που μπορούν να λειτουργήσουν με οποιαδήποτε στοιχεία HTML:

bxSlider: ρυθμιστικό περιεχομένου jQuery HTML

Το bxSlider είναι ένα από τα καλύτερα ρυθμιστικά περιεχομένου jQuery που είναι διαθέσιμα σήμερα. Αυτό το πρόσθετο είναι τέλειο για την οργάνωση slideshows:

CarouFredSel: ένα ευέλικτο και ισχυρό πρόσθετο καρουζέλ jQuery

Το jQuery.carouFredSel είναι ένα πρόσθετο που μετατρέπει οποιοδήποτε στοιχείο HTML σε καρουζέλ περιεχομένου. Σας επιτρέπει να κάνετε κύλιση σε ένα ή περισσότερα στοιχεία ταυτόχρονα, τόσο οριζόντια όσο και κάθετα. Μπορείτε επίσης να ενεργοποιήσετε την αυτόματη αναπαραγωγή και να κάνετε την κύλιση ατελείωτη:

Ποδηλατικό καρουζέλ περιεχομένου με jQuery

Ένα καρουζέλ στο οποίο κάθε κλικ θα αποκαλύπτει ένα νέο μπλοκ περιεχομένου. Κάνοντας κλικ στο σταυρό θα κλείσει το ενεργό μπλοκ και θα επιστρέψουμε στην αρχική θέση προβολής μικρογραφιών:

Cloud Carousel: τρισδιάστατο καρουζέλ σε Javascript

Αυτό το καρουσέλ σας επιτρέπει να δημιουργήσετε μια ρεαλιστική προοπτική. Πολλά τρισδιάστατα καρουζέλ jQuery εφαρμόζουν ένα προοπτικό εφέ μόνο στο μέγεθος της εικόνας, όχι στη θέση της, γεγονός που οδηγεί σε δυσαναλογία στοιχείων στη σελίδα:

Elastislide: καρουζέλ με απόκριση με jQuery

Το Elastislide είναι ένα καρουζέλ jQuery με απόκριση που προσαρμόζεται σε οποιοδήποτε μέγεθος οθόνης. Η εισαγωγή ενός καρουζέλ σε ένα δοχείο με εύκαμπτο πλάτος θα κάνει το ίδιο το καρουζέλ «λαστιχένιο»:

jCarousel Lite

Με αυτό το πρόσθετο θα μπορείτε να προβάλλετε εικόνες ή στοιχεία HTML ως ρυθμιστικό. Ζυγίζει μόνο 2Kb, αλλά ταυτόχρονα σας επιτρέπει να χρησιμοποιήσετε τις δικές σας ρυθμίσεις:

τρισδιάστατο καρουζέλ

Δημιουργήστε ένα τρισδιάστατο καρουζέλ jQuery από εικόνες με εφέ σκιών και κινούμενα σχέδια που αντιδρούν στη θέση του δρομέα:

Πρόσθετο JQuery carousel

Οι ρυθμίσεις αυτής της προσθήκης σάς επιτρέπουν να προσδιορίσετε πόσα στοιχεία θα εμφανίζονται στο καρουζέλ, μετά το οποίο η προσθήκη την προσαρμόζει στο επιθυμητό πλάτος:

Περιστρεφόμενο ρυθμιστικό εικόνας με jQuery

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

jQuery Feature Carousel

Αυτή η προσθήκη έχει σχεδιαστεί για να εμφανίζει προτεινόμενα άρθρα στην αρχική σελίδα, αλλά μπορεί επίσης να χρησιμοποιηθεί για οποιοδήποτε άλλο περιεχόμενο. Επιτρέπει την ταυτόχρονη εμφάνιση έως και τριών εικόνων, ενώ το υπόλοιπο καρουσέλ περιεχομένου jQuery είναι κρυφό:

jQuery Infinite Carousel

Είναι ένα πρόσθετο jQuery που σας επιτρέπει να προβάλλετε απεριόριστο αριθμό εικόνων και βίντεο σε ένα καρουζέλ. Σε αντίθεση με άλλα καρουζέλ, το Infinite Carousel εμφανίζει στοιχεία σε έναν ατελείωτο βρόχο χωρίς την ανάγκη χρήσης πλοήγησης:

Πρόσθετο jQuery Liquid Carousel

Το Liquid Carousel είναι ένα πρόσθετο σχεδιασμένο για τη δημιουργία ρευστών σχεδίων. Κάθε φορά που το κοντέινερ καρουζέλ με απόκριση jQuery αλλάζει σε μέγεθος, ο αριθμός των στοιχείων που εμφανίζονται προσαρμόζεται στο νέο πλάτος:

Jquery MS Carousel

Από τον συγγραφέα:Παρά τις φήμες για τον υποτιθέμενο «θάνατο» του τμήματος των ιστοσελίδων που είναι ορατό χωρίς κύλιση, η ανάγκη για ένα καλό ρυθμιστικό δεν έχει εξαφανιστεί. Ας είμαστε ειλικρινείς για λίγο - τα ρυθμιστικά είναι διασκεδαστικά. Επιπλέον, τίποτα άλλο, σε αντίθεση με το μετακινούμενο περιεχόμενο, δεν προκαλεί ένα φαινόμενο "wow" στον χρήστη. Όλα τα ρυθμιστικά είναι ένα σύνολο πολλών διαφανειών που αντικαθιστούν το ένα το άλλο και είναι εξαιρετικά σημαντικό ο κωδικός του ρυθμιστικού να είναι όσο το δυνατόν πιο ελαφρύς. Σε τέτοιες περιπτώσεις το jQuery θα μας βοηθήσει.

Ρίξτε μια ματιά στα 20 ρυθμιστικά jQuery από το Envato Market και θα συνειδητοποιήσετε ότι υπάρχουν ρυθμιστικά που είναι κάτι περισσότερο από ένα μπλοκ εικόνων που ρέουν ομαλά μέσα από αυτά.

1. RoyalSlider – Συλλογή εικόνων με οθόνη αφής με χρήση jQuery

Σήμερα, ένα ρυθμιστικό με απόκριση που είναι επίσης φιλικό στην οθόνη αφής σημαίνει πολλά περισσότερα από πριν. Το RoyalSlider συνδυάζει και τα δύο χαρακτηριστικά: ανταπόκριση και λειτουργικότητα οθόνης αφής. Μια καλή επιλογή αφού η συλλογή είναι γραμμένη σε HTML5 και CSS3.

Πολλά ενδιαφέροντα χαρακτηριστικά:

Πώς να δημιουργήσετε μόνοι σας έναν ιστότοπο;

Βελτιστοποίηση SEO

Εξαιρετικά προσαρμόσιμο

Περισσότερα από 10 πρότυπα εκκίνησης

Υπάρχει μια εναλλακτική για τις μεταβάσεις CSS3

Κατά τη γνώμη μου, το πιο ωραίο χαρακτηριστικό είναι η "αρθρωτή αρχιτεκτονική σεναρίου", η οποία σας επιτρέπει να αποκλείετε περιττά πράγματα από το κύριο αρχείο JS, μειώνοντας έτσι το βάρος. Το RoyalSlider, μια συλλογή εικόνων με οθόνη αφής στο JQuery, είναι ένα ισχυρό ρυθμιστικό JavaScript που θα πρέπει να προστεθεί στην εργαλειοθήκη οποιουδήποτε προγραμματιστή.

2. Προσθήκη jQuery με απόκριση Slider Revolution

Δεν είναι εύκολο να κάνεις κάτι «επαναστατικό» με ένα slider. Όσον αφορά τα ρυθμιστικά, υπάρχουν τόσες πολλές δυνατότητες που μπορείτε να προσθέσετε σε αυτά. Ωστόσο, το Slider Revolution είναι μια πραγματικά καλή προσπάθεια. Μεταξύ των ρυθμιστικών jQuery, αυτή η εμφάνιση ικανοποιεί όλες τις πιθανές απαιτήσεις σας.

Η λίστα με τα χαρακτηριστικά του ρυθμιστικού είναι τόσο μεγάλη, οπότε θα απαριθμήσω μόνο τα καλύτερα:

Εφέ Parallax και προσαρμοσμένη κινούμενη εικόνα

Απεριόριστος αριθμός επιπέδων και διαφανειών με συνδέσμους

έτοιμα προς χρήση, βαθιά προσαρμόσιμα στυλ

και πολλα ΑΚΟΜΑ

Η δυνατότητα προσθήκης εικόνας, ενσωματωμένου προγράμματος αναπαραγωγής βίντεο και συνδέσμων μέσων κοινωνικής δικτύωσης καθιστά το Slider Revolution μία από τις πιο ευέλικτες και προσαρμόσιμες επιλογές στον Ιστό.

3. Προσαρμοστικό πρόσθετο slider jQuery LayerSlider

Το όνομα "LayerSlider adaptive jQuery slider plugin" δεν μπορεί να αξιολογήσει πραγματικά αυτό το ρυθμιστικό.
200+ 2D και 3D μεταβάσεις μεταξύ διαφανειών θα γυρίσουν το κεφάλι οποιουδήποτε.

Μερικά αξιοσημείωτα χαρακτηριστικά:

13 skins και 3 τύπους μενού

Δυνατότητα τοποθέτησης σταθερής εικόνας πάνω από το ρυθμιστικό

Και εναλλακτικό jQuery

Και πολλα ΑΚΟΜΑ

Όπως και με το προηγούμενο ρυθμιστικό, μπορείτε να προσθέσετε σχεδόν οποιοδήποτε περιεχόμενο, ακόμη και περιεχόμενο πολυμέσων μόνιμο HTML5. Το LayerSlider ζωντανεύει τα ρυθμιστικά και είναι πολύ όμορφο.

4. jQuery Banner Rotator / Slideshow

Το jQuery Banner Rotator / Slideshow είναι ένα αρκετά απλό ρυθμιστικό που δεν θυσιάζει την κύρια λειτουργικότητα.

Δυνατότητες:

Συμβουλές εργαλείων, ένθετα κειμένου κ.λπ.

Προεπισκοπήσεις και διάφορες επιλογές για την προβολή στοιχείων

Χρονοδιακόπτης με καθυστέρηση για ένα ρυθμιστικό ή για όλους

Πολλαπλές μεταβάσεις για όλες τις διαφάνειες ή διαφορετικές μεταβάσεις για κάθε μία ξεχωριστά

Το jQuery Banner Rotator / Slideshow, σε σύγκριση με άλλα ρυθμιστικά JQuery, έχει μόνο βασικές δυνατότητες, αλλά δεν πρέπει να το ξεχάσετε.

5. All In One Slider – Responsive jQuery slider plugin

Κάθε ρυθμιστικό που εμφανίζεται στο Διαδίκτυο έχει το δικό του μοναδικό όραμα και λύνει τυχόν προβλήματα στον τομέα του. Όχι όμως αυτό. Το All In One Slider μπορεί να ονομαστεί "all inclusive".

Νομίζω ότι οι περισσότεροι προγραμματιστές και σχεδιαστές ιστού έχουν μια δοκιμασμένη λύση, αλλά πάντα αναζητούν κάτι νέο. Και αυτό το «κάτι νέο» περιλαμβάνει:

Περιστροφέας πανό

Πανό με προεπισκόπηση

Banner με playlist

Ρυθμιστικό περιεχομένου

Στροβιλοδρόμιο

Όλοι οι τύποι ρυθμιστικών υποστηρίζουν τις περισσότερες, αν όχι όλες, τις λειτουργίες που απαιτούνται από τα ρυθμιστικά jQuery. Το All In One Slider θα είναι το all-inclusive σας;

6. UnoSlider – Προσαρμόσιμο ρυθμιστικό οθόνης αφής

Εάν το ρυθμιστικό σας δεν αποκρίνεται και δεν υποστηρίζει οθόνες αφής, τότε έχετε λάθος ρυθμιστικό. Το UnoSlider είναι σωστό.

Αυτό το ρυθμιστικό έχει βρει τη θέση του στον ήλιο ανάμεσα στην απλότητα και ένα πλούσιο σύνολο λειτουργιών. Λειτουργίες:

Υποστήριξη θεμάτων

12 έτοιμα θέματα

40 μεταβάσεις

Υποστήριξη IE6+

Όλες οι δυνατότητες με έμφαση στη σχεδίαση και το στυλ, καθιστώντας το UnoSlider ένα εξαιρετικό ρυθμιστικό περιεχομένου με δυνατότητα προσθήκης θεμάτων.

7. Master Slider - slider οθόνης αφής jQuery

Ψάχνετε για "ένα ρυθμιστικό jQuery για να τα κυβερνά όλα"; Δοκιμάστε το Master Slider – ρυθμιστικό οθόνης αφής JQuery για διαφορετικά μεγέθη οθόνης...

Όταν πρόκειται για καλό σχεδιασμό, αυτό το παράδειγμα είναι ένα από τα καλύτερα:

Περισσότερα από 25 πρότυπα

Επιταχυνόμενες μεταβάσεις υλικού

Αγγίξτε και σύρετε την υποστήριξη

Και πολλα ΑΚΟΜΑ

Διαδραστικές μεταβάσεις, κινούμενα επίπεδα και hotspot σίγουρα θα τραβήξουν την προσοχή σας. Το Master Slider είναι ένα έργο τέχνης.

8. TouchCarousel - κύλιση και ρυθμιστικό περιεχομένου jQuery

Το TouchCarousel προσφέρει δωρεάν υποστήριξη και ενημερώσεις. Ωστόσο, δεν είναι όλα αυτά τα χαρακτηριστικά αυτού του ελαφρού ρυθμιστικού καρουζέλ jQuery.

Εάν η λέξη "touch" υπάρχει στο όνομα, μπορείτε να μαντέψετε ότι το ρυθμιστικό είναι πλήρως προσαρμοστικό και υποστηρίζει αγγίγματα. Αλλα χαρακτηριστικά:

Βελτιστοποίηση SEO

Έξυπνη αυτόματη αναπαραγωγή

Μεταβάσεις CSS3 με επιτάχυνση υλικού

Προσαρμόσιμο UI και 4 skins για Photoshop

Το TouchCarousel, λόγω της μοναδικής φυσικής κύλισης slide, ανεβάζει τις εμπειρίες μέσω κινητού σε ένα εντελώς νέο επίπεδο.

9. Advanced Slider - slider jQuery XML

Τα ρυθμιστικά jQuery μπορούν να χρησιμοποιηθούν όχι μόνο σε ιστότοπους. Μπορούν επίσης να είναι χρήσιμα σε διαδικτυακές εφαρμογές. Το Advanced Slider σάς επιτρέπει να το κάνετε αυτό.

Με τη σήμανση HTML ή XML, αυτό το προηγμένο ρυθμιστικό κάνει μια μόνιμη εντύπωση:

Κινούμενα επίπεδα και έξυπνο βίντεο

100+ μεταβάσεις και 150+ προσαρμοσμένες ιδιότητες

15 slider skins, 7 skinbars scrollbar και ενσωματωμένη υποστήριξη lightbox

Πλοήγηση με πληκτρολόγιο, υποστήριξη αφής και πλήρης προσαρμογή

Και πολλα ΑΚΟΜΑ

Ωστόσο, το καλύτερο χαρακτηριστικό είναι το Advanced Slider - jQuery XML Slider API, καθιστώντας το ιδανική επιλογή ρυθμιστικού για την εφαρμογή web σας.

10. jQuery Slider Zoom In/Out Εφέ Πλήρως απόκριση

Ένα από αυτά τα slider jQuery που θα σας κάνουν να παρακολουθήσετε ένα demo πριν ξεκινήσετε να διαβάζετε για τις δυνατότητές του. Απλώς θέλετε να καταλάβετε τι σημαίνει αυτό το «φαινόμενο μεγέθυνσης/σμίκρυνσης».

Το εφέ ζουμ είναι αρκετά αδύναμο, αλλά προσθέτει μια αίσθηση ελέγχου και πραγματική πινελιά στην εικόνα ενώ το υπόλοιπο ρυθμιστικό είναι στατικό. Ειδικά χαρακτηριστικά του ρυθμιστικού:

Μεταβάσεις επιπέδου CSS3

Επιλογή τέλους κινούμενης εικόνας για επίπεδα

Επιλογές σταθερού πλάτους, πλήρους οθόνης και πλήρους πλάτους

Κινούμενο κείμενο με μορφοποίηση HTML και CSS

Τα περισσότερα ρυθμιστικά προσπαθούν να ενσωματώσουν όσο το δυνατόν περισσότερα εφέ, αλλά το jQuery Slider Zoom In/Out Effect Fully Responsive έχει μόνο το εφέ Ken Burns, αλλά έχει εφαρμοστεί καλά.

11. jQuery Carousel Evolution

Όπως το προαναφερθέν Advanced Slider - jQuery XML Slider, το jQuery Carousel Evolution έχει το δικό του API που μπορεί να χρησιμοποιηθεί για τη βελτίωση της λειτουργικότητας ή την ενσωμάτωση του ρυθμιστικού σε άλλο έργο.

Πώς να δημιουργήσετε μόνοι σας έναν ιστότοπο;

Ποιες τεχνολογίες και γνώσεις χρειάζονται σήμερα για να δημιουργήσετε μόνοι σας ιστοσελίδες; Μάθετε στην εντατική!

Με εικόνες, σήμανση HTML, βίντεο YouTube και Vimeo θα λάβετε επίσης:

Βελτιστοποίηση SEO

9 στυλ καρουζέλ

Εφέ σκιάς και αντανάκλασης

Το μέγεθος της εικόνας μπορεί να ρυθμιστεί, τόσο μπροστά όσο και πίσω

Το jQuery Carousel Evolution είναι ένα απλό καρουζέλ με πολλές περιπτώσεις χρήσης.

12. Sexy Slider

Το Sexy Slider δεν είναι πλέον τόσο σέξι όσο πριν. Ωστόσο, λόγω της ηλικίας του, αυτό το ρυθμιστικό είναι αξιόπιστο.

Το ρυθμιστικό δεν φαίνεται πολύ εντυπωσιακό με την πρώτη ματιά, αλλά αν το προσαρμόσετε καλά, θα ταιριάζει απόλυτα στο σχέδιό σας. Δυνατότητες:

Αυτόματη αναπαραγωγή διαφανειών

Λεζάντες εικόνων

Συνεχής αναπαραγωγή διαφανειών

6 εφέ μετάβασης

Το Sexy Slider σας περιμένει να ξεκλειδώσετε την πλήρη ισχύ και τις δυνατότητές του.

13. jQuery Image & Content Scroller με Lightbox

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

Το jQuery Image & Content Scroller w/ Lightbox υποστηρίζει την είσοδο πληκτρολογίου και τον τροχό του ποντικιού, καθώς και άλλες δυνατότητες:

Οριζόντιος και κάθετος προσανατολισμός

Λεζάντες κειμένου μέσα ή έξω από το ρυθμιστικό

Δυνατότητα ορισμού ορισμένου αριθμού διαφανειών ορατών ταυτόχρονα

Ενσωματωμένες εικόνες, Flash, iframe, Ajax και ενσωματωμένο περιεχόμενο

Το ρυθμιστικό έχει επίσης ενσωματωμένο lightbox. Εάν θέλετε, στο jQuery Image & Content Scroller w/ Lightbox δεν μπορείτε να εκκινήσετε το ίδιο το ρυθμιστικό, αλλά να εκκινήσετε το lightbox ξεχωριστά.

14. Ημιδιαφανές – Προσαρμοστικός περιστροφέας/ρυθμιστικός banner

Τα περισσότερα ρυθμιστικά jQuery έχουν τη δική τους σχεδίαση. Μπορείτε να το προσαρμόσετε μόνοι σας, αλλά μερικές φορές θέλετε απλώς τα πάντα να βρίσκονται μέσα στο ρυθμιστικό. Σας παρουσιάζουμε το Translucent.

Το ρυθμιστικό έχει πολλές προεπιλογές. Ίσως χρειαστεί απλώς να ορίσετε ορισμένες ρυθμίσεις και αυτό είναι. Δυνατότητες:

6 διαφορετικά στυλ

4 εφέ μετάβασης

2 μεταβάσεις ολίσθησης

Προσαρμόσιμα κουμπιά και λεζάντες

Όπως και τα άλλα, αυτό το ρυθμιστικό είναι ευαίσθητο στην αφή, απόκριση και επιτάχυνση υλικού. Το Translucent είναι ένα ρυθμιστικό με μίνιμαλ σχεδιασμό που βάζει το ίδιο το περιεχόμενο πρώτο.

15. FSS – Προσθήκη συρόμενης ιστοσελίδας σε πλήρη οθόνη

Θέλετε να δημιουργήσετε έναν ιστότοπο πλήρους οθόνης που να αποτελείται από διαφάνειες; Τότε χρειάζεστε FSS.

Στην πραγματικότητα, χρησιμοποιώντας αυτό το ρυθμιστικό JQuery είναι εξαιρετικά εύκολο να δημιουργήσετε έναν ιστότοπο με ρυθμιστικό πλήρους οθόνης. Δυνατότητες:

Υποστήριξη AJAX

Γραμμή κύλισης

Υποστήριξη τεχνολογίας Deep linking

2 διαφορετικά εφέ μετάβασης

Αξίζει επίσης να προσέξετε την υποστήριξη του πληκτρολογίου και τον οδηγό 11 σελίδων. Ωστόσο, η πραγματική εντύπωση είναι το βάρος του FSS, μόλις 5Kb.

16. Zozo Accordion – Προσαρμόσιμο ρυθμιστικό οθόνης αφής

Ένα άλλο παράδειγμα ρυθμιστικού jQuery που εστιάζει στο στυλ και κάνει καλή δουλειά. Το Zozo Accordion είναι απαραίτητο για όσους αναζητούν ένα καλό ρυθμιστικό ακορντεόν με δυνατότητα αλλαγής στυλ.

Αυτή η ομορφιά κινουμένων σχεδίων CSS3 έχει επίσης αρκετά ευρύ φάσμα χαρακτηριστικών:

Οριζόντιο και κάθετο ακορντεόν

Σημασιολογική HTML5 και βελτιστοποίηση SEO

Υποστήριξη αφής, πληκτρολογίου και WAI-ARIA

Περισσότερα από 10 skins και 6 layouts

Και πολλα ΑΚΟΜΑ

Το Zozo Accordion έχει δωρεάν υποστήριξη και συνεχείς ενημερώσεις, καθώς και όλες τις δυνατότητες που θέλετε σε ένα ακορντεόν jQuery.

17. jQuery Responsive OneByOne Slider Plugin

Το jQuery Responsive OneByOne Slider Plugin μοιάζει περισσότερο με ένα απλό animation παρά με ένα slider. Αντί να εμφανίζεται μία διαφάνεια τη φορά, αυτή η περίπτωση γεμίζει την οθόνη με διαφάνειες ένα βήμα τη φορά έως ότου δεν υπάρχει άλλος χώρος στην περιοχή πριν προχωρήσετε στην επόμενη διαφάνεια.

Το κινούμενο σχέδιο CSS3 εκτελείται στο Animate.css, είναι ελαφρύ, αποτελείται από πολλά επίπεδα και είναι φιλικό προς κινητά. Πολλαπλά χαρακτηριστικά:

Υπάρχει επίσης μια επιλογή πλοήγησης με μεταφορά και απόθεση. Το jQuery Responsive OneByOne Slider Plugin τροφοδοτείται από το Twitter Bootstrap Carousel.

18. Accordionza - πρόσθετο jQuery

Δεν υπάρχει πιο εύκολο ρυθμιστικό jQuery από αυτό. Για να λειτουργήσετε, πρέπει να κατεβάσετε μόνο 3 Kb του ρυθμιστικού, γεγονός που καθιστά το Accordionza το πιο ελαφρύ ρυθμιστικό ακορντεόν.

Εάν δεν σας αρέσουν οι τρεις επιλογές στυλ, μπορείτε να τροποποιήσετε μόνοι σας το HTML και το CSS. Δυνατότητες:

Πλοήγηση με πληκτρολόγιο

Εύκολη προσαρμογή εφέ και κουμπιών

Τεχνική προοδευτικής βελτίωσης - λειτουργεί χωρίς JavaScript

Να θυμάστε ότι το Accordionza μπορεί να εμφανίσει πολλές παραλλαγές μικτού περιεχομένου, καθιστώντας το εξαιρετικά ευέλικτο.

19. mightySlider – Αποκριτικό ρυθμιστικό πολλαπλών χρήσεων

Το MightySlider είναι ένα πραγματικά ισχυρό ρυθμιστικό. Μπορεί να χρησιμοποιηθεί όχι μόνο ως απλό ρυθμιστικό εικόνας, αλλά και ως ρυθμιστικό μονής κατεύθυνσης πλήρους οθόνης με πλοήγηση στοιχείων μενού. Με τη βοήθειά του μπορείτε να φτιάξετε έναν υπέροχο μονοσέλιδο ιστότοπο.

Κάτω από την κουκούλα θα βρείτε πολλές επιλογές:

Υποστήριξη πληκτρολογίου, ποντικιού και αφής

Μεταβάσεις CSS3 με επιτάχυνση υλικού

Καθαρίστε έγκυρη σήμανση και βελτιστοποίηση SEO

Απεριόριστος αριθμός διαφανειών, επίπεδα για υπότιτλους και εφέ για αυτές

Το API είναι πολύ ισχυρό και φιλικό προς τους προγραμματιστές, το οποίο ανοίγει διαφορετικούς τρόπους χρήσης του. Το MightySlider είναι ένα εξαιρετικό, προοδευτικό ρυθμιστικό jQuery με καθαρό και καλά σχολιασμένο κώδικα.

20. Parallax Slider - Responsive jQuery plugin

Το Parallax Slider λειτουργεί όπως το jQuery Responsive OneByOne Slider Plugin και σας επιτρέπει να κάνετε κίνηση σε κάθε επίπεδο ξεχωριστά μέσα σε μία μόνο διαφάνεια. Μπορείτε να κάνετε κίνηση σε όλες τις διαφάνειες ή ακόμα και μόνο μία προσθέτοντας κινούμενα σχέδια parallax.

Το σετ περιλαμβάνει 4 ρυθμιστικά διαφορετικών τύπων, όλα με εφέ parallax. Όπως και άλλα ρυθμιστικά jQuery, έχει:

Πλήρως προσαρμόσιμο

Αγγίξτε υποστήριξη

Πλήρως απόκριση, απεριόριστα επίπεδα

Αυτόματη αναπαραγωγή, επαναφορά, ρύθμιση ύψους και πλάτους και χρονόμετρο

Τα κινούμενα επίπεδα δεν αφορούν μόνο κείμενο ή εικόνες. Μπορείτε επίσης να προσθέσετε βίντεο YouTube, Vimeo και HTML5. Το Parallax Slider είναι ένα άλλο καλό παράδειγμα για το πώς μπορείτε να προσομοιώσετε τα εφέ Flash ακόμα καλύτερα από το ίδιο το Flash, το οποίο επίσης υποστηρίζεται σε όλες τις συσκευές.

συμπέρασμα

Είναι ενδιαφέρον να δούμε πώς τα ρυθμιστικά jQuery έχουν αναπτυχθεί από κάτι που απλώς αντικατέστησε μια εικόνα με μια άλλη σε ένα τεράστιο σύνολο δημιουργικών εργαλείων. Τώρα υπάρχουν ρυθμιστικά 3D, parallax, ρυθμιστικά πλήρους σελίδας, προσαρμοστικά ρυθμιστικά και αυτά που μπορούν να προβληθούν τόσο σε επιτραπέζιους υπολογιστές όσο και σε smartphone.

Εάν δεν σας αρέσει κανένα από τα ρυθμιστικά αυτής της λίστας, μπορείτε πάντα να πάρετε το jQuery Code Tutorial στο Envato και να σχεδιάσετε κάτι εντελώς νέο και μοναδικό.

Ή δείτε άλλα ρυθμιστικά στο Envato Market - υπάρχουν πολλά για να διαλέξετε. Ποιο είναι το αγαπημένο σας ρυθμιστικό jQuery και γιατί;

Εάν πρέπει να προσθέσετε ένα ρυθμιστικό εικόνας jQuery υψηλής ποιότητας στον ιστότοπό σας, τότε σε αυτό το άρθρο θα βρείτε μια περιγραφή των απαραίτητων προσθηκών. Παρόλο που το JQuery έχει κάνει πολύ πιο εύκολη την εργασία με JavaScript, εξακολουθούμε να χρειαζόμαστε πρόσθετα για να επιταχύνουμε τη διαδικασία σχεδίασης ιστού.

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

Για άλλα ρυθμιστικά, απλά προσθέτετε τίτλους, εικόνες και επιλέγετε εφέ μετάβασης διαφανειών που συνοδεύουν το ρυθμιστικό. Όλα αυτά τα πρόσθετα συνοδεύονται από λεπτομερή τεκμηρίωση, επομένως η προσθήκη νέων εφέ ή λειτουργιών σε αυτά δεν θα είναι δύσκολη. Μπορείτε ακόμη και να αλλάξετε τους κανόνες που βασίζονται σε συμβάντα εάν είστε έμπειρος προγραμματιστής JQuery.

Οι τελευταίες τάσεις, όπως το responsive design, είναι πολύ σημαντικές για τα web projects, είτε εφαρμόζετε ένα πρόσθετο είτε ένα σενάριο. Όλα αυτά τα στοιχεία καθιστούν κάθε ένα από αυτά τα πρόσθετα πολύ ευέλικτο. Όλα όσα βγήκαν το 2014 περιλαμβάνονται σε αυτή τη λίστα.

Ρυθμιστικά εικόνας jQuery

Jssor Responsive Slider

Πρόσφατα συνάντησα αυτό το ισχυρό ρυθμιστικό jQuery και μπόρεσα να δω από πρώτο χέρι ότι κάνει πολύ καλά τη δουλειά του. Περιέχει απεριόριστες δυνατότητες που μπορούν να επεκταθούν μέσω του ανοιχτού κώδικα του ρυθμιστικού:

• Προσαρμοστικός σχεδιασμός;
• Περισσότερες από 15 επιλογές προσαρμογής.
• Περισσότερα από 15 εφέ αλλαγής εικόνας.
• Συλλογή εικόνων, καρουζέλ, υποστήριξη μεγέθους πλήρους οθόνης.
• Κατακόρυφος περιστροφέας banner, λίστα διαφανειών.
• Υποστήριξη βίντεο.

Επίδειξη | Κατεβάστε

PgwSlider - αποκριτικό ρυθμιστικό που βασίζεται σε JQuery / Zepto

Το μόνο καθήκον αυτού του πρόσθετου είναι να εμφανίζει διαφάνειες εικόνων. Είναι πολύ συμπαγές, καθώς τα αρχεία JQuery έχουν μέγεθος μόνο 2,5 KB, γεγονός που του επιτρέπει να φορτώνει πολύ γρήγορα:

• Προσαρμοστική διάταξη.
• Βελτιστοποίηση SEO?
• Υποστήριξη για διαφορετικά προγράμματα περιήγησης.
• Απλές μεταβάσεις εικόνας.
• Το μέγεθος του αρχείου είναι μόνο 2,5 KB.

Επίδειξη | Κατεβάστε

Jquery Vertical News Slider

Ένα ευέλικτο και χρήσιμο ρυθμιστικό JQuery σχεδιασμένο για ειδησεογραφικούς πόρους με μια λίστα δημοσιεύσεων στην αριστερή πλευρά και μια εικόνα που εμφανίζεται στα δεξιά:

• Προσαρμοστικός σχεδιασμός;
• Κάθετη στήλη για εναλλαγή ειδήσεων.
• Διευρυμένες κεφαλίδες.

Επίδειξη | Κατεβάστε

Wallop Slider

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

• Προσαρμοστική διάταξη.
• Απλός σχεδιασμός?
• Διάφορες επιλογές αλλαγής διαφανειών.
• Ελάχιστος κώδικας JavaScript.
• Το μέγεθος είναι μόνο 3KB.

Επίδειξη | Κατεβάστε

Επίπεδη γκαλερί Polaroid

Μια γκαλερί σε στυλ διάσπαρτα σε ένα γραφείο με ευέλικτη διάταξη και όμορφο σχεδιασμό θα πρέπει να ενδιαφέρει πολλούς από εσάς. Πιο κατάλληλο για tablet και μεγάλες οθόνες:

• Προσαρμοστικό ρυθμιστικό.
• Επίπεδη σχεδίαση?
• Τυχαία αλλαγή διαφανειών.
• Πλήρης πρόσβαση στον πηγαίο κώδικα.

Επίδειξη | Κατεβάστε

A-Slider

Επίδειξη | Κατεβάστε

HiSlider – HTML5, jQuery και ρυθμιστικό εικόνας WordPress

Το HiSlider παρουσίασε ένα νέο δωρεάν πρόσθετο slider jQuery με το οποίο μπορείτε να δημιουργήσετε μια ποικιλία από γκαλερί εικόνων με φανταστικές μεταβάσεις:

• Προσαρμοστικό ρυθμιστικό.
• Δεν απαιτεί γνώσεις προγραμματισμού.
• Πολλά καταπληκτικά πρότυπα και δέρματα.
• Όμορφα εφέ μετάβασης.
• Υποστήριξη για διαφορετικές πλατφόρμες.
• Συμβατό με WordPress, Joomla, Drupal.
• Δυνατότητα προβολής διαφορετικών τύπων περιεχομένου: εικόνες, βίντεο YouTube και βίντεο Vimeo.
• Ευέλικτη εγκατάσταση.
• Χρήσιμα πρόσθετα χαρακτηριστικά.
• Απεριόριστος αριθμός περιεχομένου που εμφανίζεται.

Επίδειξη | Λήψη

Wow Slider

Το WOW Slider είναι ένα αποκριτικό ρυθμιστικό εικόνας jQuery με εκπληκτικά οπτικά εφέ ( ντόμινο, περιστροφή, θόλωση, αναστροφή και φλας, πέτα έξω, περσίδες) και επαγγελματικά πρότυπα.

Το WOW Slider συνοδεύεται από έναν οδηγό εγκατάστασης που σας επιτρέπει να δημιουργείτε φανταστικά ρυθμιστικά σε δευτερόλεπτα χωρίς να χρειάζεται να κατανοήσετε κώδικα ή να επεξεργαστείτε εικόνες. Οι εκδόσεις του πρόσθετου για Joomla και WordPress είναι επίσης διαθέσιμες για λήψη:

• Πλήρως απόκριση.
• Υποστηρίζει όλα τα προγράμματα περιήγησης και όλους τους τύπους συσκευών.
• Υποστήριξη για συσκευές αφής.
• Εύκολη εγκατάσταση στο WordPress.
• Ευελιξία στη διαμόρφωση.
• Βελτιστοποιημένο για SEO.

Επίδειξη | Λήψη

Nivo Slider – δωρεάν πρόσθετο jQuery

Το Nivo Slider είναι γνωστό σε όλο τον κόσμο ως το πιο όμορφο και εύχρηστο ρυθμιστικό εικόνας. Το πρόσθετο Nivo Slider είναι δωρεάν και κυκλοφορεί υπό την άδεια MIT:

• Απαιτεί JQuery 1.7 και άνω.
• Όμορφα εφέ μετάβασης.
• Απλό και ευέλικτο στη διαμόρφωση.
• Συμπαγές και προσαρμοστικό.
• Ανοιχτή πηγή;
• Δυνατό και απλό.
• Πολλά διαφορετικά πρότυπα.
• Αυτόματη περικοπή εικόνας.

Επίδειξη | Λήψη

Απλό ρυθμιστικό jQuery με τεχνική τεκμηρίωση

Η ιδέα ήταν εμπνευσμένη από τα ρυθμιστικά της Apple, στα οποία πολλά μικρά στοιχεία μπορούν να πετάξουν έξω με διαφορετικά εφέ κινούμενων σχεδίων. Οι προγραμματιστές προσπάθησαν να εφαρμόσουν αυτήν την ιδέα, λαμβάνοντας υπόψη τις ελάχιστες απαιτήσεις για τη δημιουργία ενός απλού σχεδιασμού ηλεκτρονικού καταστήματος, στο οποίο τα "ιπτάμενα" στοιχεία αντιπροσωπεύουν διαφορετικές κατηγορίες:

• Προσαρμοστική διάταξη.
• Μινιμαλιστικός σχεδιασμός;
• Διάφορα εφέ εγκατάλειψης και αλλαγής διαφανειών.

Επίδειξη | Λήψη

Ρυθμιστικό εικόνας jQuery πλήρους μεγέθους

Ένα πολύ απλό ρυθμιστικό που καταλαμβάνει το 100% του πλάτους της σελίδας και προσαρμόζεται στα μεγέθη οθόνης των φορητών συσκευών. Λειτουργεί με μεταβάσεις CSS και οι εικόνες «στοιβάζονται» μαζί με άγκυρες. Η άγκυρα μπορεί να αντικατασταθεί ή να αφαιρεθεί εάν δεν θέλετε να επισυνάψετε σύνδεσμο στην εικόνα.

Όταν εγκατασταθεί, το ρυθμιστικό επεκτείνεται στο 100% του πλάτους της οθόνης. Μπορεί επίσης να μειώσει αυτόματα το μέγεθος των εικόνων διαφανειών:

• Προσαρμοστικό ρυθμιστικό JQuery.
• Πλήρες μέγεθος;
• Μινιμαλιστικό σχέδιο.

Επίδειξη | Λήψη

Elastic Content Slider + tutorial

Το Elastic Content Slider προσαρμόζει αυτόματα το πλάτος και το ύψος με βάση τις διαστάσεις του γονικού στοιχείου. Αυτό είναι ένα απλό ρυθμιστικό jQuery. Αποτελείται από μια περιοχή διαφάνειας στο επάνω μέρος και μια γραμμή καρτέλας πλοήγησης στο κάτω μέρος. Το ρυθμιστικό προσαρμόζει το πλάτος και το ύψος του ανάλογα με τις διαστάσεις του μητρικού κοντέινερ.

Όταν προβάλλονται σε μικρές διαγώνιες οθόνες, οι καρτέλες πλοήγησης μετατρέπονται σε μικρά εικονίδια:

• Προσαρμοστικός σχεδιασμός;
• Κύλιση με κλικ του ποντικιού.

Επίδειξη | Λήψη

Δωρεάν 3D Stack Slider

Ένα πειραματικό ρυθμιστικό που κάνει κύλιση στις εικόνες σε 3D. Οι δύο στοίβες μοιάζουν με στοίβες χαρτιού, από τις οποίες, όταν κάνετε κύλιση, εμφανίζονται εικόνες στο κέντρο του ρυθμιστικού:

• Προσαρμοστικός σχεδιασμός;
• Αναστροφή - μετάβαση;
• 3D εφέ.

Επίδειξη | Λήψη

Slit Slider πλήρους οθόνης βασισμένο σε φροντιστήριο JQuery και CSS3 +

Αυτό το σεμινάριο θα σας δείξει πώς να δημιουργήσετε ένα ρυθμιστικό με μια περιστροφή: η ιδέα είναι να "κόψετε" και να εμφανίσετε την τρέχουσα διαφάνεια καθώς ανοίγετε την επόμενη ή την προηγούμενη εικόνα. Χρησιμοποιώντας JQuery και CSS animation, μπορούμε να δημιουργήσουμε μοναδικά εφέ μετάβασης:

• Προσαρμοστικός σχεδιασμός;
• Διαίρεση μετάβασης;
• Ρυθμιστικό πλήρους οθόνης.

Επίδειξη | Λήψη

Unislider - ένα πολύ μικρό ρυθμιστικό jQuery

Χωρίς περιττά κουδούνια και σφυρίχτρες, μέγεθος μικρότερο από 3KB. Χρησιμοποιήστε οποιονδήποτε κώδικα HTML για τις διαφάνειές σας, επεκτείνετε τον με CSS. Όλα όσα σχετίζονται με το Unslider φιλοξενούνται στο GitHub:

• Υποστήριξη για διάφορα προγράμματα περιήγησης.
• Υποστήριξη πληκτρολογίου.
• Ρύθμιση ύψους;
• Προσαρμοστικός σχεδιασμός;
• Υποστήριξη εισόδου αφής.

Επίδειξη | Κατεβάστε

Ελάχιστες διαφάνειες απόκρισης

Απλό και συμπαγές πρόσθετο ( το μέγεθος είναι μόνο 1 KB), το οποίο δημιουργεί ένα ρυθμιστικό με απόκριση χρησιμοποιώντας στοιχεία μέσα σε ένα κοντέινερ. Το ResponsiveSLides.js λειτουργεί με ένα ευρύ φάσμα προγραμμάτων περιήγησης, συμπεριλαμβανομένων όλων των εκδόσεων του IE από IE6 και νεότερες εκδόσεις:

• Πλήρως απόκριση.
• Μέγεθος 1 KB;
• Μεταβάσεις CSS3 με δυνατότητα εκτέλεσης μέσω JavaScript.
• Απλή σήμανση χρησιμοποιώντας λίστες με κουκκίδες.
• Δυνατότητα προσαρμογής εφέ μετάβασης και διάρκεια προβολής μιας διαφάνειας.
• Υποστηρίζει τη δυνατότητα δημιουργίας πολλαπλών προβολών διαφανειών.
• Αυτόματη και χειροκίνητη κύλιση.

Επίδειξη | Λήψη

Κάμερα - δωρεάν ρυθμιστικό jQuery

Η κάμερα είναι ένα πρόσθετο με πολλά εφέ μετάβασης και μια διάταξη που αποκρίνεται. Εύκολη ρύθμιση, που υποστηρίζεται από κινητές συσκευές:

• Πλήρως απόκριση σχεδίασης.
• Υπογραφές;
• Δυνατότητα προσθήκης βίντεο.
• 33 διαφορετικά χρώματα εικονίδια.

Επίδειξη | Λήψη

SlidesJS, ανταποκρινόμενο πρόσθετο jQuery

Το SlidesJS είναι μια αποκριτική προσθήκη για το JQuery (1.7.1 και άνω) με υποστήριξη για συσκευές αφής και μεταβάσεις CSS3. Πειραματιστείτε με αυτό, δοκιμάστε μερικά έτοιμα παραδείγματα που θα σας βοηθήσουν να καταλάβετε πώς να προσθέσετε το SlidesJS στο έργο σας:

• Προσαρμοστικός σχεδιασμός;
• CSS3 μεταβάσεις.
• Υποστήριξη για συσκευές αφής.
• Εύκολο στη ρύθμιση.

Επίδειξη | Κατεβάστε

BX Jquery Slider

Αυτό είναι ένα δωρεάν ρυθμιστικό jQuery με απόκριση:

• Πλήρως απόκριση - προσαρμόζεται σε οποιαδήποτε συσκευή.
• Οριζόντια, κατακόρυφη αλλαγή διαφάνειας.
• Οι διαφάνειες μπορεί να περιέχουν εικόνες, βίντεο ή περιεχόμενο HTML.
• Διευρυμένη υποστήριξη για συσκευές αφής.
• Χρήση μεταβάσεων CSS για κινούμενα σχέδια διαφανειών ( επιτάχυνση υλικού);
• Callback API και πλήρως δημόσιες μέθοδοι.
• Μικρό μέγεθος αρχείου.
• Εύκολο στην εφαρμογή.

Επίδειξη | Λήψη

FlexSlider 2

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

Επίδειξη | Κατεβάστε

Galleria - Αποκριτική συλλογή φωτογραφιών που βασίζεται σε JavaScript

Το Galleria χρησιμοποιείται σε εκατομμύρια ιστότοπους για τη δημιουργία γκαλερί εικόνων υψηλής ποιότητας. Ο αριθμός των θετικών κριτικών για τη δουλειά της είναι απλά εκτός τσαρτ:

• Εντελώς δωρεάν.
• Λειτουργία προβολής πλήρους οθόνης.
• 100% προσαρμοστικό?
• Δεν απαιτείται εμπειρία προγραμματισμού.
• Υποστήριξη για iPhone, iPad και άλλες συσκευές αφής.
• Flickr, Vimeo, YouTube και άλλα.
• Αρκετά θέματα.

Επίδειξη | Κατεβάστε

Blueberry - ένα απλό ρυθμιστικό εικόνας jQuery με απόκριση

Σας παρουσιάζω ένα ρυθμιστικό εικόνας jQuery γραμμένο ειδικά για responsive σχεδιασμό ιστοσελίδων. Το Blueberry είναι μια πειραματική προσθήκη ρυθμιστικού εικόνων ανοιχτού κώδικα που γράφτηκε ειδικά για να λειτουργεί με αποκριτικά πρότυπα.