Share
Ci sono stati molti post sul numero di fantastici plugin jQuery e su dove trovarli. Tuttavia, a volte è meglio non fare affidamento su plugin e risorse di terze parti. Fai da te alla vecchia maniera! Oggi daremo un'occhiata a oltre 20 usi creativi di jQuery nei moderni siti Web e applicazioni; certo di ispirarti per il tuo prossimo progetto.
Uno dei nostri sporadici scrittori, James Padolsey, ha una bella caratteristica sul suo sito web. Una barra "personalizza" nella parte in alto a destra dello schermo consente di modificare il colore di sfondo dell'intestazione.
Visita il sito
Questi ragazzi sono praticamente degli dei del web design, e il loro sito lo dimostra davvero. Dai un'occhiata alla navigazione jQuery personalizzata che hanno usato sulla loro homepage. Hai mai visto una navigazione così sexy nella tua vita?
Visita il sito
FamFamFam aveva bisogno di un lightbox personalizzato come script per FamSpam (wow, diciamo così tre volte). Hanno finito per costruire quello che ora è conosciuto come FaceBox, che replica gli effetti di lightbox, ma va ben oltre consentendo di caricare in pagine html statiche, moduli di contatto, tutto ciò che desideri davvero! FaceBox è ora un plugin jQuery dopo tutte le richieste per il loro script.
Visita il sito
Invece di andare con un tipico menù flash / menu di controllo, Grooveshark lo ha mescolato un po 'e ha creato uno script jQuery personalizzato per permetterti di creare i tuoi widget musicali; piuttosto carino davvero.
Visita il sito
CSS-Tricks, di Chris Coyier, è prossimo alla lista con una navigazione jQuery meravigliosamente semplice e creativa. Quando i collegamenti vengono posizionati sopra, invece di cambiare immediatamente i colori, jQuery viene utilizzato per aiutare il colore a sfumare lentamente fino al colore desiderato.
Visita il sito
Lo sviluppatore David Walsh di DavidWalsh.name implementa uno script estremamente semplice da usare per dare ai tuoi link un piccolo spunto al passaggio del mouse. Lo script utilizza le potenti funzionalità di animazione di jQuery attivate al passaggio del mouse. Controlla i link nella barra laterale e nel footer per vedere l'effetto in azione.
Visita il sito
Se controlli il sito web CarrotCreative, noterai due effetti jQuery davvero unici. Innanzitutto, se fai clic sui siti in alto a sinistra, vedrai un'applicazione unica di un effetto simile a "lightbox" che elenca i loro siti e le loro icone. In secondo luogo, se fai clic su qualsiasi link di navigazione, noterai che non c'è alcun aggiornamento, ma che la nuova pagina scorre semplicemente da destra. Roba forte!
Visita il sito
Un altro speciale "Due per uno", Bright Creative utilizza un effetto bagliore estremamente sottile nella loro navigazione che è molto calmo e caldo. Inoltre, tutte le pagine del portfolio hanno un effetto tab, quindi non è necessario che l'utente aggiorni la pagina ogni volta, grazie a AJAX e jQuery.
Visita il sito
Non molto tempo fa, Connor Zwick ci ha scritto un bel tutorial che dimostra esattamente come creare un form di login drop down fantastico.
Visita il sito
Sarebbe un insulto chiamare questo tipo di "tendone" (i brividi che pronunciano quella parola). Invece, Aviary ha creato uno 'scroller' molto bello e funzionante per mostrare molto testo in una piccola quantità di spazio. Ancora meglio è che lo scroller si degraderà con garbo javascript è disabilitato.
Visita il sito
DesignFlavr, noto per le sue grandi fonti di ispirazione del design, ha messo insieme un semplice script fadeIn / fadeOut per mostrare le loro opere d'arte in primo piano e le relative descrizioni. Inoltre, hanno usato il plugin lavalamp abbastanza bene nella loro navigazione principale.
Visita il sito
Nella home page di Hv-Designs, noterai che l'icona RSS inizia come contorno / schizzo dell'immagine reale. Quindi, al passaggio del mouse, le icone rss "si illuminano" in posizione.
Visita il sito
Oltre ad essere un sito web assolutamente esilarante, Asylum ha il suo dolce script di articoli in primo piano. È difficile mettere un dito sul motivo per cui questo è così bello, ma probabilmente è perché si comporta in modo leggermente diverso rispetto alla maggior parte degli script a scorrimento. Sembra quasi che si inserisca in posizione dopo aver dato un clic.
Visita il sito
Brian Reindel ha creato una pagina web che mostra 5 script personalizzati che puoi utilizzare come preferisci. L'articolo prende le idee e le tecniche javascript usate frequentemente e utilizza jQuery per renderle potenti, compatte e facili da leggere.
Visita il sito
Coda è ben noto per la sua straordinaria interfaccia utente e design del sito. Ha dato il via alla community dei plugin jQuery ispirando molti sviluppatori a ricreare il loro effetto tabbing della pagina. Inoltre, hanno un meraviglioso effetto hover sui collegamenti situati nell'intestazione.
Visita il sito
ClarkLab è un autore ben noto e di grande successo su ThemeForest. Se visiti il suo portfolio qui sotto, noterai che le immagini di intestazione di grandi dimensioni svaniscono alla fine, mostrando tutti i suoi ultimi lavori. L'effetto di dissolvenza è così ben fatto e sottile, a malapena si nota la nuova immagine che appare.
Visita il sito
Il designer e direttore artistico Rob Young ha usato un'idea unica di mostrare le sue opere su uno schermo Mac simulato. Quindi, usando gli effetti di scorrimento jQuery, ogni nuova pagina scorre nella vista della pagina come se fosse caricata su un computer.
Visita il sito
Oltre ad essere un sito web visivamente sbalorditivo, WDW presenta alcuni script jQuery personalizzati unici per aggiungere classi a determinati elementi al passaggio del mouse. Controlla gli effetti quando il rss e gli elementi di navigazione sono al passaggio del mouse.
Visita il sito
Un altro effetto di tabulazione davvero interessante: invece di frecce, l'impaginazione e AJAX vengono utilizzate per creare un'esperienza utente elegante e pulita. Inoltre, la navigazione ha un effetto molto piacevole, anche se semplice.
Visita il sito
Ho salvato il mio sito preferito in assoluto per ultimo. In primo luogo, basta guardare quel disegno, è meravigliosamente unico e confortante. Utilizzando uno degli script jQuery più creativi che abbia mai visto, KM ha un cursore "foliage-o-meter" in cui lo scorrimento aumenta o diminuisce il fogliame e il design del tema, a seconda della direzione in cui viene spostato il cursore. Per un easter egg assicurati di controllare il codice sorgente!
Visita il sito
Tieni presente che jQuery è semplicemente uno strumento ed è limitato solo dalla tua creatività e dal tuo livello di abilità. Ottieni unicità con i tuoi progetti e il tuo processo di sviluppo e potresti rimanere sorpreso nel vedere grandi risultati. Assicurati di condividere uno dei tuoi siti web preferiti con usi unici di jQuery nella sezione commenti qui sotto! ... E un Digg o un inciampo sarebbe molto apprezzato! :)
Accentsconagua