Gian Carlo Mingati. Design and development for interactive media.

Dopo avere sperimentato un altro pò con la galleria di immagini realizzata nel precedente post, ho realizzato il mio primo plugin ufficiale per jquery: slideViewer.

Si usa molto banalmente; si parte da una lista non ordinata (UL) con dentro delle immagini. Gli si dà un ID (id=”marspanorama”) ed una classe (class=”svw”) e in perfetto stile jQuery gli si ‘applica’ il plugin dopo avere atteso che sia il DOM sia le immagini si siano caricate:


$(window).bind("load", function() {
$("div#marspanorama").slideView();
});


27 giugno 2007: enhanced tooltips
Una cosa che mi ha portato a verificare se un altro plugin poteva essere integrato in slideViewer opzionalmente, e cioè che potesse funzionare con o senza altri plugin estendendo le sue features, è stato il numero di feedback ricevuti sulla discussion list di jQuery.

Commenti come questo, proprio dall’inventore dell’utilissimo toolTip plugin mi hanno fatto molto piacere:

Now, how cool is that? Great stuff. I love the backinout easing. I consider integration of plugins the toughest part of all plugin development, nice to see some great work getting done on that matter :-)

In un paio di giorni (non full-time eh, ho anche gli elicotteri da far volare…) ho integrato il tolTip plugin e ho reso parametrizzabili il tipo di animazione e la sua durata. Il tutorial con gli esempi sono sempre alla stessa pagina comunque posto in queste due righe:


$("div#mygalthree").slideView({
easeFunc: "bounceinout",
easeTime: 2400,
toolTip: true
});


Si tratta del comando che diamo nell’head della nostra paginetta html se vogliamo creare un galleria di immagini che abbia 2 secondi e quasi-mezzo di durata della transizione tra un foto e l’altra, e che rimbalzi per esempio tramite la funzione bounceinout. Ah appunto, vogliamo anche un tooltip un pò gajardo…

et voilà, slideViewer plugin per jQuery.

Got it, thanks. Fantastic, most lightweight/best slide carousel out there. money. :-P
— E.

Una lista di siti che usano jquery.slideviewer aggiornata al 01/04/2008:
Zachary Zavislak Photography
Di Stefano landscaping
Rival Songs