Χρησιμοποιώντας το jQuery για το Juice Up μιας συνηθισμένης ιστοσελίδας

jquery

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

Όλα τα σύγχρονα προγράμματα περιήγησης μπορούν να εκτελούν αποτελεσματικά τη JavaScript (ορισμένες πρόσφατες τροποποιήσεις στο Firefox όμως, έχουν επιταχύνει πραγματικά τον κινητήρα τους). Θα συνιστούσα ανεπιφύλακτα τη λήψη και τη χρήση του Firefox - του Plugins από μόνο του το κάνει ανεκτίμητο.

jQuery είναι ένα πλαίσιο JavaScript με το οποίο πειραματίζομαι όλο και περισσότερο πρόσφατα. Όταν έβαλα ένα placeholder για μια νέα εκκίνηση, δεν είχαμε αρκετό περιεχόμενο για έναν πλήρη ιστότοπο, αλλά θέλαμε να δημιουργήσουμε μια ωραία σελίδα που να περιγράφει τι θα ερχόταν. Και θέλαμε να το κάνουμε σε λίγα λεπτά!

Το jQuery έκανε το τέχνασμα.

Κάντε μια αναζήτηση για το jQuery + σχεδόν οτιδήποτε και θα βρείτε επίσης ότι οι προγραμματιστές έχουν δημιουργήσει λύσεις, που ονομάζονται plugins, που είναι έτοιμες! Σε αυτήν την περίπτωση, έκανα μια αναζήτηση για το "jQuery carousel" και βρήκα μια φανταστική, περιεκτική Λύση καρουσέλ jQuery στο Dynamic Drive.

Ένα άλλο ωραίο πράγμα για το jQuery είναι ότι είναι Ο κώδικας φιλοξενείται τώρα από την Google. Ως αποτέλεσμα, δεν χρειάζεται να ανεβάσετε το jQuery στον δικό σας διακομιστή, ούτε οι αναγνώστες του ιστότοπού σας πρέπει να το κατεβάζουν κάθε φορά. Εάν έχουν επισκεφτεί έναν ιστότοπο με αναφορά στο jQuery, αποθηκεύεται αυτόματα για χρήση με τον ιστότοπό σας!

Απλώς προσθέστε τον κωδικό στην ετικέτα της κεφαλής σας και ξεκινάτε με το jQuery:


Για να τρέξω το καρουσέλ, έπρεπε να ανεβάσω και να αναφέρω το σενάριο stepcarousel:


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

Μπορείτε να προσαρμόσετε λίγο την ενέργεια. Σε αυτήν την περίπτωση τροποποίησα το σενάριο για να εκτελείται αυτόματα όταν φορτώνεται η σελίδα. Προσαρμόσαμε την ταχύτητα και τη διάρκεια εμφάνισης κάθε πίνακα, καθώς και τα κουμπιά για να περιστρέψω χειροκίνητα τα πάνελ αριστερά και δεξιά. Ένα άλλο δροσερό χαρακτηριστικό αυτού του plugin - όταν φτάσετε στον τελευταίο πίνακα, αυτό τυλίγει επιστροφή στην πρώτη!

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

3 Σχόλια

  1. 1

    Αυτήν τη στιγμή ξαναχτίζω τον ιστότοπό μου και στοχεύω να ξεκινήσω αυτό το Σαββατοκύριακο αν όλα πάνε καλά. Χρησιμοποιώ το jQuery για μερικές πτυχές του και μέχρι στιγμής δεν έχω καταγγελίες. Όλα φαίνεται να εκπέμπουν αυτή την αίσθηση «web 2.0» και ελπίζουμε ότι θα συμπληρώσουν μόνο τον τελικό ιστότοπο.

Ποια είναι η γνώμη σας;

Αυτός ο ιστότοπος χρησιμοποιεί το Akismet για να μειώσει το spam. Μάθετε πώς επεξεργάζονται τα δεδομένα των σχολίων σας.