Δημιουργήστε μια νέα ticker με την PHP και jQuery News Ticker

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

Συνήθως τα αιτήματα που είναι χαμηλά στην αρχή:. "Χρειάζομαι μια στατική επίδειξη εκεί ... βάζετε με δύο ημερών από τρία χρόνια Visual Studio τμήματα κώδικα και ούτω καθεξής, όμως, ο προγραμματιστής γνωρίζει ότι το μυαλό φίλο, μερικές φορές με καλή πίστη, άλλοι λίγο λιγότερο.

Επειδή καταλαβαίνετε ότι είμαι και πάλι σε αυτόν τον ευαίσθητο κατάσταση και η αίτηση δεν αναμένεται αυτή τη φορά για μια νέα ticker. Καλά βασικά χειρότερα από ό, τι σκέφτηκα, γι 'αυτό πάμε στη δουλειά μας για να δοκιμάσετε κάτι ωραίο και προσαρμόσιμη.
Αρχικά θεωρώ ότι η αναζήτηση Google ιστοσελίδα JQuery News Ticker . Πείστε μου.
«S HTML για να δημιουργήσετε απλές, καλογραμμένο τεκμηρίωση, την απαλλαγή. Τώρα που το πρώτο βήμα για το δεύτερο πρόβλημα έχει λυθεί: ο φίλος μου δεν έχει DB ...

Η λύση

Εάν υπάρχει DB πάντα να χρησιμοποιήσετε τα αρχεία κειμένου για τις ειδήσεις, ευτυχώς, ο φίλος μου ξέρει πώς να χρησιμοποιήσει το «ftp, το μόνο πρόβλημα είναι να διασφαλίσουμε ότι δεν θα πρέπει τα απόβλητα πάρα πολύ χρόνο για να δημιουργήσετε το δικό ειδήσεις του. I επιλέξουν αυτή τη δυνατότητα:

Θα είναι εύκολο να φέρει την είδηση ​​ως απλά αρχεία κειμένου κάτω από το φάκελο με το ίδιο όνομα και τις εικόνες σε υποφάκελο εικόνων. Μια προειδοποίηση: το ίδιο όνομα για τη νέα και την εικόνα του (εκτός αν η παράταση).

Για τα υπόλοιπα, είναι να έχουμε ένα φάκελο στον οποίο να τεθεί τάξεις η μοναδική τάξη που χρησιμοποιείται, το φάκελο js jQuery, το ticker, η οποία προετοιμαστεί το αρχείο και ένα φάκελο για το CSS στυλ.

Μέσω επισυνάψει επίσης ένα στιγμιότυπο από τη δημιουργία του έργου Eclipse.

Το JS

Εκτός από τις τελευταίες JQuery (1.6.1 κατά το χρόνο της γραφής), παίρνω το πακέτο JQuery News Ticker jquery.ticker.js το αρχείο. Δεν πρέπει να αλλάξει τίποτα, μπορώ να δημιουργήσω ένα μόνο αρχείο για την προετοιμασία του ticker στο DOM Ready newsloader.js.

newsloader.js

 / / DOM-ready







 $ (Function () {



  



 / / Δημιουργία του ticker



  



 $ ('# JS-news »). Σύμβολα ({



    



 ajaxFeed: ψευδείς, / / ​​όχι ζωοτροφών



    



 htmlFeed: αλήθεια, / / ​​html είναι



    



 titleText: «Breaking News», / / ​​ticker



    



 DisplayType: «ξεθωριάζει», / / ​​Αποκάλυψη ή ξεθωριάζει, ξεθωριάζει επιλέξετε



    



 Σκηνοθεσία: "ltr", / / ​​κατεύθυνση ticker



    



 pauseOnItems: 5000, / / ​​αφιερώστε χρόνο για να διαβάσετε την είδηση ​​για τον πλοηγό!



    



 fadeInSpeed: 600, / / ​​fade-in ταχύτητα



    



 fadeOutSpeed: 300 / / fade-out ταχύτητα



  



 })?







 })?

Το σενάριο κάνει είναι να δημιουργήσει το ticker για το DOM Ready, περνώντας τις επιλογές χρήσιμο, ειδικά σε αυτή την περίπτωση επέλεξα να χρησιμοποιήσει το ξεθωριάζει και δεν αποκαλύπτουν την καθαρή αισθητική επιλογή.
Σημείωση: Η Αποκάλυψη δημιουργεί την επίδραση της "write-on" που κάνει τόσο πολύ γραφομηχανή.
Ένα άλλο σημαντικό pauseOnItems ρύθμιση έθεσα σε 5 δευτερόλεπτα για να δοθεί ο χρόνος για τον αναγνώστη να πάτε στο κάτω μέρος των ειδήσεων.

• <<
• 1
• 2
• 3
• 4
• 5
• >>