Fedeweb » Javascript

jQuery Plugin – Slideshow Full Screen di Immagini

fedeweb — Mon, 16 Jan 2012 07:57:04 +0000

Oggi vediamo a mio avviso il miglior plugin jquery per realizzare uno slideshow full screen da utilizzare come sfondo nel sito.

Si tratta di Vegas, realizzato da Jay Salvat, che ti permetterà di realizzare in pochi passi uno slideshow di impatto e con caratteristiche che altri slider non hanno.

Come puoi vedere dalla demo, le immagini si adattano perfettamente alla finestra del browser e potrai impostare facilmente un pattern, che verrà messo sopra l’immagine.

Per utilizzarlo al meglio, ti invito a leggere la documentazione, dalla quale potrai notare che basteranno pochissimi passi per utilizzare il plugin. Per qualsiasi problema non esitare a scrivermi nei commenti

In passato, sempre in questo blog, è stato proposto un tutorial jquery su come realizzare uno slideshow di immagini come sfondo del sito.

Tutorial Jquery – Slideshow Di Foto Come Sfondo Del Sito

Inoltre ti segnalo un articolo dedicato alla User Experience, dove si parla proprio dell’uso delle immagini e dei video come sfondo nei siti web.

User Experience: Immagini (Video) ed Emozioni

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

jQuery Plugin Scrollorama – Effetti di Scrolling Originali

fedeweb — Mon, 09 Jan 2012 07:30:01 +0000

Scrollorama è un plugin jQuery che ti permetterà di realizzare delle animazioni durante lo scrolling del sito.

Effetti di parallasse, zoom, rotazioni, fade verranno applicati durante lo scrolling verticale del sito agli elementi che desideri.

Per ottenere questi effetti bastano pochi semplici passi, che ti invito ad analizzare nel sito ufficiale dove potrai scaricare l’esempio e accedere alla documentazione

Questo plugin lo trovo particolarmente indicato per siti a una pagina con navigazione verticale animata, come puoi vedere in questi quattro esempi.

Smokey Bones

Anna Safroncik

Nike Better World

Shop Pub

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

Galleria di Foto Piena Di Effetti – jQuery Plugin Smart Gallery

fedeweb — Thu, 01 Dec 2011 08:10:44 +0000

Smart Gallery è un plugin jQuery che permette di realizzare una galleria di immagini originale, in pochi passi.

Il punto di forza di questa gallery è il numero di effetti di transizione che puoi utilizzare tra una foto e l’altra, come puoi vedere dalla demo.

Inoltre si potrà navigare tra le foto tramite le miniature, rendendo quindi la galleria completa e funzionale.

Il funzionamento è davvero semplice e ti consiglio di leggere la pagina del plugin per capire come utilizzarla.

Altre gallery che potrebbero esserti utili:

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

jQuery Plugin FerroSlider – Slider di Contenuti Full Screen

fedeweb — Mon, 14 Nov 2011 08:00:18 +0000

FerroSlider è un plugin jQuery che ti pemetterà di realizzare una navigazione animata in orizzontale e in verticale, realizzato da Alessandro Ferrini.

Guardalo in azione nel sito di Francesco Mugnai.

Come puoi vedere questo plugin riesce a dare imprevedibilità al sito, potendo scegliere una classica navigazione tra le pagine orizzontale o verticale, oppure mettendole insieme in un “percorso” personalizzato.

Potrai navigare tra le diverse sezioni anche utilizzando la tastiera, e inoltre è supportato dai dispositivi mobili iOS e Android, potendo con una gesture passare da una pagina all’altra del sito.

L’utilizzo del plugin è davvero semplice, almeno per le funzionalità base, e trovi tutto spiegato nei dettagli nella pagina di documentazione.

Ti invito a scaricare e provare FerroSlider, una nuova tecnica, utile per distinguerti dalla massa e dare quel valore aggiunto al tuo sito

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

Ordinare, Cercare, Filtrare Elementi in Una Lista HTML – List.js

fedeweb — Wed, 02 Nov 2011 08:38:17 +0000

List.js è una libreria javascript che ti permetterà di manipolare delle liste HTML.

Potra infatti ordinare le liste, fare una ricerca, filtrare gli elementi in base a un criterio, eliminarli, come puoi vedere in questo esempio.

La libreria è di facile utilizzo, grazie anche all’ampia documentazione che ti spiegherà come usare list.js al meglio.

La ritengo una risorsa estremamente utile, per organizzare al meglio i contenuti e dare la possibilità all’utente di trovare più facilmente quello che gli serve.

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

FlexSlider – Slider Reattivo in jQuery

fedeweb — Tue, 25 Oct 2011 07:33:26 +0000

FlexSlider è un plugin jQuery che ti permetterà di realizzare uno slider di immagini reattivo al ridimensionamento della finestra del browser.

Con la diffusione sempre più consistente degli smartphone e quindi della navigazione web su mobile, è importante realizzare dei siti web responsive, che si adattino alle diverse risoluzioni.

E uno degli elementi che dovrà adattarsi è proprio lo slider e quindi ecco che ci viene incontro flexslider, plugin facilissimo da integrare nel tuo sito.

Come spiegato nella documentazione, potrai personalizzare lo slideshow come preferisci, agendo su diversi parametri.

Inoltre FlexSlider è supportato da tutti i browser e potrai inserire non solo immagini ma qualsiasi contenuto html.

Ti consiglio di scaricarlo e provarlo: è importante iniziare a sperimentare e provare a creare layout responsive e questo plugin potrebbe essere un inizio per scoprire questo nuovo modo di realizzare siti.

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

Skitter – Slideshow jQuery con 30 Diverse Animazioni (Anche Per WordPress)

fedeweb — Wed, 12 Oct 2011 07:00:26 +0000

In questo blog si è parlato spesso di slideshow jQuery, proponendo diversi tutorial e soluzioni per questo elemento sempre più presente nei siti. Proprio perchè è sempre più diffuso, bisogna sapersi distinguere e trovare sempre qualcosa di nuovo.

E quindi oggi voglio condividere con te Skitter un plugin jQuery che ti permetterà di realizzare slideshow con 30 animazioni diverse.

Questo plugin ha diverse possibilità di personalizzazione, come il tipo di animazione tra un’immagine e l’altra, la navigazione tra le diverse foto se renderla numerica, oppure avere le miniature o ancora i pallini.

E’ stata creata anche la versione per WordPress, dove potrai integrare lo slideshow, presentando delle foto presenti nella libreria Media, oppure i post.

Skitter è compatibile con tutti i browser, quindi potrai utilizzarlo senza problemi per i tuoi progetti.

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

jQuery Plugin Portamento – Pannello Sempre Visibile

fedeweb — Mon, 26 Sep 2011 07:00:06 +0000

Portamento è un plugin jQuery che ti permetterà di realizzare un pannello che seguirà lo scroll della pagina, in modo da averlo sempre visibile.

Questa tecnica può essere utile quando vogliamo promuovere una nuova iniziativa e renderla sempre visibile all’utente, oppure anche sfruttarlo per creare una barra di menu fissa, come puoi vedere in questo esempio.

Per vedere in azione il plugin ti bastano poche righe di codice, quindi ti invito a visitare la pagina ufficiale dove troverai la documentazione e avrai la possibilità di chiedere supporto

Il plugin è compatibile con tutti i browser, ovviamente IE 6 escluso.

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

25 Siti con Effetti jQuery da Cui Prendere Ispirazione

fedeweb — Fri, 23 Sep 2011 07:34:57 +0000

Ritorna l’appuntamento del venerdì con raccolte di siti da cui prendere ispirazione.

Oggi ho raccolto per te 25 siti che hanno utilizzato jQuery in modo creativo, da prendere come esempio per futuri progetti.

Alcune delle tecniche che si sono utilizzare nei siti che stai per vedere sono spiegate anche nei tutorial jQuery.

Netzebewegung

Jerome Detraz

Marco Rotoli

Undergrad

Zenith Arena

Jay Hollywood

Johnny Broccoli

RGA Comunicacao

Ante Meridiem Design

Allan Yu

Appear

Altimea

IWC Shaffausen

Eric Johansson

Cafundo

Unfold

Hunter’s Wines

Slice Machine

Eye Draw

Driving Features

Talkability

The Destination

Head2Heart

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!

jQuery Fundamentals – Libro su jQuery Gratis

fedeweb — Fri, 22 Apr 2011 07:44:36 +0000

Appuntamento come ogni venerdì con risorse per web designer.

Oggi ti segnalo jQuery Fundamentals, un libro da leggere on line dove imparerai le basi di jQuery.

La guida è composta da 11 capitoli “teorici” e alla fine di ognuno sono presenti degli esercizi dove applicare quanto imparato. Inoltre sono presenti tantissimi esempi per le più svariate applicazioni.

Ti segnalo inoltre una lista di libri che ho realizzato tempo fa per jQuery, WordPress e sul web design in generale.

Scarica gratis il jQuery Mega Pack con tutti i miei tutorial jQuery!