Segnalazione di alcune plugins jQuery di varia utilità

1
Segnalazione di alcune pluginsjQuery di varia utilità
Pro e contro nel loro utilizzo, comparazione con plugins simili, osservazioni.
Danilo Sanchi, Riccione
Retina Snc, Cattolica

2
Le plugins di cui parleremo sono:
jScrollPane
Jcrop
jQueryImageAnnotation
Easy Slider
ImageShadow
UnitPngPix
onImageLoadPlugin
jQueryCanvasRoundedCorners

3
jScrollPane
Sito:
www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html
Descrizione:
Realizza una scrollbar in un div a dimensioni fisse
Pro:
Buona UX, intercetta il mouse wheel, reinizializzazioneonImageLoad
Contro:
Monoautore (blog), scrollbar a scomparsa.
Osservazioni:
Dipende da più librerie. Meglio dello Slider della UI.
uiSlider

4
Jcrop
Sito:
deepliquid.com/content/Jcrop.html
Descrizione:
Interfaccia web per il ritaglio di immagini
Osservazioni:
Ottima UX.
Utilizzato da Gravatar.
Da agganciare a codice server-side.
Utile per imporre immagini a proporzioni fisse.
gravatar

5
jQueryImageAnnotation
Sito:
http://www.flipbit.co.uk/jquery-image-annotation.html
Descrizione:
Interfaccia web per il binding di commenti a porzioni di immagine
Osservazioni:
Basato su ImageAnnotationPluginforDrupal.
Tag delle fotografie, vedi Flickr, Facebook
Interfaccia per creare mappe di link su un’immagine

6
Easy Slider
Sito:
http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding
Descrizione:
Slide show di testo e immagini.
Osservazioni:
Varie opzioni per coprire la maggior parte dei bisogni
Facile manipolazione CSS
at

7
ImageShadow
Sito:
http://www.gcmingati.net/wordpress/2007/03/14/drop-shadow-con-jquery/
Descrizione:
Tecnica per generare l’ombra alle immagini
Osservazioni:
Div annidati generati da jQuery
Dimensione variabile
dropShadowPlugintecnica

8
UnitPngFix
Sito:
http://labs.unitinteractive.com/unitpngfix.php
Descrizione:
PngFix per IE6
Pro:
Non sono necessari width ed height. Background e img.
Contro:
Non è jQuery. Conflitti con il ready di jQuery.
Osservazioni:
Si può estrarre la funzione e legarla al ready
onload

9
UnitPngFix
Hack per utilizzarlo con jQuery
function loadLightBox() { … }
function onImgLoad($selector) { //note: $selector is $('body') here }
function onLoad() {
pngfix();
$('body').onImagesLoad({ selectorCallback:onImgLoad });
loadLightBox();
}
$(document).ready(onLoad);
var clear="img/clear.gif"; //path to clear.gif
pngfix = function() {
if (!(jQuery.browser.msie && jQuery.browser.version.substr(0,1)<"7")) return;
…
}
onload

10
onImagesLoadPlugin
Sito:
http://plugins.jquery.com/project/onImagesLoad
Descrizione:
Gestione dell’evento onImagesLoad
Osservazioni:
Differente dall’evento onLoad:
onLoad: fine lettura index.php
onImagesLoad: fine scaricamento di tutte le immagini

11
jQueryCanvasRoundedCorners
Sito:
http://ragamo.medioclick.com/jquery/corners/
Descrizione:
Genera div con gli angoli arrotonadati
Osservazioni:
Sfruttando il Canvas di JS disegna le stondature sugli angoli.

12
Conclusione
Grazie per l’attenzione,
Danilo

http://www.javascriptcamp.com	71
http://www.slideshare.net	10

Segnalazione di alcune plugins jQuery di varia utilità

by Danilo Sanchi on Oct 16, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

2 Embeds 81

Statistics

Segnalazione di alcune plugins jQuery di varia utilità — Presentation Transcript