Come creare uno slideshow con NivoSlivder

tramite: O2O
Difficoltà: media
15

Introduzione

Se avete bisogno di utilizzare uno slideshow che sia semplice sia nell'installazione, sia nella configurazione che nell'utilizzo, allora il NivoSlivder è uno dei migliori attualmente consigliati ed anche utilizzati.
Indicato per tutti i siti web, appoggia al framework JQuery ed offre numerosi vantaggi nell'utilizzo tra cui, ad esempio, una vasta gamma di effetti grafici di transizione sulle immagini.
Vediamo insieme con questa breve e semplice guida come installarlo e come creare uno slideshow con il nuovissimo NivoSlider.

25

Occorrente

Assicurati di avere a portata di mano:
  • Computer
  • Connessione internet
  • Editor codice HTML
35

Il primo passo è scaricare il plugin in maniera semplice e veloce dal sito http://nivo.dev7studios.com che è aggiornato all'ultima versione disponibile ossia la 3.1.
Ciò significa che il nome del file sarà il seguente "nivo-slider3.1. Zip".
Il download è gratuito se usate NivoSlider come plugin di JQuery, pagherete, invece, se lo si vorrà integrare nel proprio blog wordpress.
Appena avrete terminato il download passerete a scompattarlo trovando così una serie di file, una cartella demo e una cartella Themes. La libreria JQuery - fondamentale per il funzionamento di nivoslider - è già presente nel pacchetto scarito, all'interno della cartella Scripts, nel caso non la troviate state tranquilli perché potrete ottenerla con un altro semplice download dal sito di jQuery.

45

Continuiamo ora con il lavoro per nivoslider aprendo il file demo.html, dalla casella demo, utilizzando un editor html ed osservate le parti salienti del codice.
Ecco i principali:
Nei tag head viene importato il file css con il tema di default (link rel="stylesheet" href="../themes/default/default. Css" type="text/css" media="screen") e il file css generale del plugin (link rel="stylesheet" href="../nivo-slider. Css" type="text/css" media="screen"). All'interno del tag body invece è posizionato il contenitore (div id="slider" class="nivoSlider") che rappresenta lo slideshow. All'interno del tag DIV con id="slider", potrete aggiungere i riferimenti alle vostre immagini (che vanno posizionate fisicamente dentro la cartella images): ricordatevi che per ottenere un maggior effetto visivo, le immagini devono essere tutte delle stesse dimensioni in larghezza ed altezza.
Prima della chiusura del tag BODY infine viene importato lo script di jquery (script type="text/javascript" src="scripts/jquery-1.7.1. Min. Js"), quello di nivo slider (script type="text/javascript" src="../jquery. Nivo. Slider. Js") e viene inizializzato lo slider sull'evento load della pagina, ovvero dopo che tutta la pagina è stata caricata ($(window). Load (function () { $('#slider'). NivoSlider (); };;)
Già fatto tutto!

Continua la lettura
55

Naturalmente potrete personalizzare tutto, anche il tema grafico usato dallo slideshow, gli effetti tra una foto e l'altra, la scelta se utilizzare o meno le thumbnail e perfino rendere lo slide automatico o manuale.
Insomma, avrete un mondo da scoprire!

Potrebbe interessarti anche

Segnala contenuti non appropriati

Tipo di contenuto
Devi scegliere almeno una delle opzioni
Descrivi il problema
Devi inserire una descrizione del problema
Si è verificato un errore nel sistema. Riprova più tardi.
Verifica la tua identità
Devi verificare la tua identità
chiudi
Grazie per averci aiutato a migliorare la qualità dei nostri contenuti

Guide simili

Windows

Come realizzare uno slideshow di fotografie

Lo sviluppo e la rapida diffusione di cellulari sempre più tecnologici, ha trasformato questi dispositivi in veri e propri computer tascabili in grado di svolgere ...
Windows

Come eliminare la pubblicità dalle pagine web con uno script

La pubblicità sul web è sempre più martellante. Alcuni siti sono diventati addirittura innavigabili a causa degli innumerevoli pop-up che si fiondano sul nostro monitor ...
Internet

Come creare un pannello con i colori con jQuery

Gli indirizzi internet devono rispettare delle norme di estetica inequivocabili e che debbano essere sensibili ad un giudizio positivo dei lettori. Per crearli si devono ...
Mac

Come eseguire il conteggio parole su TextEdit per Mac

Ci sarà sicuramente capitato, di aver bisogno di conoscere il numero di parole di cui è composto un testo da noi redatto al computer. Il ...
Programmazione

Come nascondere i paragrafi in Jquery con un click

Tutte le pagine web che quotidianamente utilizziamo sono ricche di effetti di ogni tipo, la cui presenza è garantita dall'impiego del linguaggio JavaScript. L ...
Programmazione

Come realizzare un finestra modale con jQuery

Una finestra modale è una finestra “figlia” bloccante, ossia una finestra che richiede una certa interazione dell’utente, prima che egli possa tornare ad operare ...
Windows

Come Installare Puglin E Script In Gimp

Il foto-ritocco è un’attività molto in uso, sia in ambito privato sia in ambito professionale. Sono sempre di più le persone, che dopo aver ...
Software

Come creare un pannello scorrevole verticale usando jQuery e CSS3

Spesso è capitato di restare colpiti dalle animazioni grafiche di qualche notizia letta in rete o da una presentazione che ci è stata sottoposta e ...
Programmazione

Come mandare una mail in PHP

Mandare un mail in PHP per un programmatore abbastanza pratico del linguaggio in Html è molto semplice e intuitivo, essendo presente la funzione mail apposita ...
Programmazione

Come usare jQuery Mobile

Da qualche tempo gli sviluppatori di software si sono posti il problema di creare degli “script” (particolari programmi scritti in un dato linguaggio di programmazione ...
Internet

Come realizzare uno slideshow fotografico da caricare su youtube

Per accontentare tutti gli amici ed i parenti che reclamano le foto del vostro ultimo viaggio, occorrerebbe organizzare una serata a tema, con tanto di ...
Internet

Come creare un menu dropdown con Jquery

Buongiorno e benvenuti in questa nuova guida, dove andremo a creare un menu a tendina, in inglese "informatichese" detto dropdown menu, con l'utilizzo di ...
Windows

Come scaricare un file FTP mediante Access

Se state leggendo questa guida è perché ogni giorno dovete scaricare decine di file mediante FTP e magari importarli manualmente sul vostro DB Access.  Qui ...
Software

Come creare una Slideshow con Photoshop

Ci sono tantissimi modi per creare una presentazione. Tuttavia utilizzando Adobe Photoshop diventa davvero facile, divertente ed i risultati sono molto gratificanti. Le ragioni per ...
Windows

Come rallentare un file audio

Una delle operazioni più frequenti in fase di editing e trasformazione di una traccia audio è quella dello "slowdown", vale a dire il rallentamento della ...
Windows

Come creare uno slideshow con Windows Live Movie Maker

Windows Live Movie Maker è il programma più semplice e intuitivo per creare uno slideshow con le vostro foto, o per mettere i sottotitoli alla ...
Windows

Imparare ad utilizzare Windows Media Player

Windows Media Player è un ottimo software gratuito, installato di default sui sistemi operativi Microsoft (nonostante sia stato rilasciato anche per Mac e altri OS ...
Programmazione

Come iniziare con JSON

Sia che siate degli studenti o dei programmatori di lungo corso sicuramente conoscerete la sigla Json che sta per JavaScript Object Nation. SI tratta infatti ...
Internet

Come eliminare i commenti indesiderati su Wordpress automaticamente

Chi possiede un blog su Wordpress saprà di certo che quando le visite iniziano ad aumentare, cominciano anche ad essere presenti alcuni commenti sotto i ...
Programmazione

Creare una tabella dinamica parametrizzata in Jquery

Spesso capita di dover inserire una tabella nelle pagine web. In alcuni casi questo è un problema perché richiede un lungo procedimento. La soluzione è ...
I presenti contributi sono stati redatti dagli autori ivi menzionati a solo scopo informativo tramite l’utilizzo della piattaforma www.o2o.it e possono essere modificati dagli stessi in qualsiasi momento. Il sito web, www.o2o.it e Arnoldo Mondadori Editore S.p.A. (già Banzai Media S.r.l. fusa per incorporazione in Arnoldo Mondadori Editore S.p.A.), non garantiscono la veridicità, correttezza e completezza di tali contributi e, pertanto, non si assumono alcuna responsabilità in merito all’utilizzo delle informazioni ivi riportate. Per maggiori informazioni leggi il “Disclaimer»”.