Archive for 'jquery'
Slide laterale dei post correlati in jQuery e CSS3!
Posted on 03. Aug, 2010 by daniele.
In questo articolo imparerete come creare un bellissimo effetto realizzato in jQuery e CSS3 che mostra i post correlati all'interno di uno slide laterale.
L'idea principale è quella di mostrare un elenco fisso sul lato destro dello schermo con alcune anteprime fuori. Quando l'utente si posiziona sugli articoli, scivolano fuori, rivelando il titolo e due link, uno per l'articolo correlato e uno per la demo. Inoltre, avremo un pulsante "shuffle" sotto la lista che quando viene premuto, la lista si aggiorna in modo casuale con i post correlati!
Link: http://tympanus.net/codrops/2010/07/21/related-posts-slide-out-boxes/
Continue Reading
Interactive Photo Desk, una galleria interattiva creata con jQuery e CSS3!
Posted on 24. Jul, 2010 by daniele.
Codrops ha creato una bellissima galleria interattiva creata con jQuery e CSS3. A mio parere è una delle gallerie fotografiche più belle che abbia mai visto (in jQuery).
L'idea è quella di avere delle foto sparse su una superficie liscia, quest'ultime possono essere trascinate, eliminate e mischiate riproducendo un'effetto simile alla realtà.
Demo: http://tympanus.net/Development/PhotoDesk/
Continue Reading
ShineTime – una galleria in jQuery e CSS3 con bellissimi effetti animati!
Posted on 22. Jul, 2010 by daniele.
Addy Osmani ha creato ShineTime, una galleria realizzata in jQuery e CSS3 che riproduce un effetto animato Polaroid (o vetro).
Come disse Mao Tse Tung, un'immagine vale più di mille parole, anche se proprio immagine non è, non mi resta che farvi vedere un'esempio di quanto detto.
Demo: http://www.addyosmani.com/resources/shinetime/
Link: http://addyosmani.com/blog/shinetime/
Continue Reading
Creare un’animazione con jQuery e CSS in pochi minuti!
Posted on 19. Jul, 2010 by daniele.
In questo periodo ci sono stati diversi dibattiti circa il futuro delle tecnologie come Adobe Flash. Con la nascita dei Framework Javascript è ora possibile creare anche animazioni con potenti effetti senza utilizzare plugins.
Nel tutorial di oggi vedremo proprio come creare queste animazioni utilizzando jQuery CSS e immagini. Oltre ad un descrizione ben dettagliata è presente anche un video che spiega come creare delle bellissime animazioni!
Link: http://addyosmani.com/blog/jquery-sprite-animation/
Continue Reading
Un semplice ToolTip jQuery in 6 differenti colori!
Posted on 18. Jul, 2010 by daniele.
Tutorialzine ha scritto un semplice plugin per jQuery chiamato Colortip. Questo Tooltip converte l'attributo title degli elementi all'interno della pagina, in una serie di suggerimenti colorati. Sei temi di colore sono disponibili, quindi si può facilmente abbinare con il resto del vostro design.
Demo: http://demo.tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin/colortips.html
Link: http://tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin/
Continue Reading
Catch404, le pagine di errore non sono mai state così belle!
Posted on 17. Jul, 2010 by daniele.
I collegamenti interrotti e le pagine di errore 404 sono un problema che hanno afflitto quasi tutti i siti web fin dagli albori di internet. Addy Osmani ha scritto un plugin per jQuery chiamato Catch404 che attraverso la magia di jQuery sarà possibile verificare il link prima di redizionare l'utente alla pagina di destinazione. In questo modo, nel caso di link interrotto o errore 404, verrà aperto un popup che lo avviserà che si è verificato un errore. Per capire meglio di cosa si tratta vi invito a guardare la demo!
Demo: http://www.addyosmani.com/resources/catch404/catch404.html
Link: http://addyosmani.com/blog/catch404/
Continue Reading
Replaceholder con un plugin jQuery!
Posted on 13. Jul, 2010 by daniele.
Attraverso questo semplice plugin jQuery sarà possibile creare un effetto Replaceholder, sostituendo l'attributo placeholder di un elemento input con l'attributo value e viceversa. Questo tipo di effetto è molto utile, in quanto l'utente viene guidato passo passo nella compilazione del form.
Demo: http://designindevelopment.com/demos/replaceholder/
Link: http://designindevelopment.com/plugins/replaceholder-jquery-plugin/
Continue Reading
[jQuery] Effetto Highlight sulle immagini!
Posted on 07. Jul, 2010 by daniele.
In questo tutorial vedrete come mettere in evidenza le immagini di anteprima che sono integrati in un articolo o all'interno di una pagina web. Questo è un buon modo per consentire agli utenti di visualizzare una versione più grande di un'immagine che è rilevante per alcuni contesti. Passando sopra la miniatura verrà oscurato lo sfondo e messa in evidenza solo l'immagine, al click su di essa verrà ingrandita per mostrare così la versione più grande.
Demo: http://tympanus.net/Tutorials/ImageHighlighter/
Link: http://tympanus.net/codrops/2010/07/04/image-highlighting-preview/
Continue Reading
Creare immagini con i bordi arrotondati con i CSS3!
Posted on 04. Jul, 2010 by daniele.
In questo articolo vedrete come creare immagini con i bordi arrotondati, utilizzando i CSS3 per i browser che li supportano (Safari e Chrome) e jQuery per gli altri browser.
Link: http://www.webdesignerwall.com/demo/jquery-css3-rounded-img/
Continue Reading
Creare una bellissima galleria fotografica in jQuery e CSS3
Posted on 03. Jul, 2010 by daniele.
In questo tutorial vedrete come creare una bellissima galleria fotografica utilizzando le proprietà dei CSS3 e jQuery. L'idea è qualla di mostrare le categorie con una miniatura che la rappresenta e una breve descrizione, al click si apriranno delle immagini che verranno sfogliate con il mouse.
Utilizzeremo i CSS3 per ruotare le immagini e per creare i riflessi nelle varie categorie, quindi al momento i browser supportati sono Google Chrome e Safari!
Link: http://tympanus.net/Tutorials/PhotoStack/











