Solitamente, per creare gallerie di immagini con qualche piccolo “effetto speciale” si è abituati ad utilizzare Javascript, un ottimo linguaggio di scripting, ma scrivendo codici lunghi e complessi, si rischia di rendere le pagine molto pesanti e quindi lente da caricare. Con l’utilizzo dei fogli di stile si ha la possibilità di creare molti effetti [...]...
Leggi il seguito »
Effetto zoom su le immagini con i css
Applicare l’effetto rollover ai nostri pulsanti!
25 gennaio 2010 - Fonte: http://bitmania.altervista.org
Oggi vi voglio spiegare come si fa ad applicare l’effetto rollover (ossia il cambio dell’immagine al passaggio del mouse) su un immagine in una pagina web.
Prima di tutto bisogna creare, utilizzando un software di editor di immagini (io utilizzo Photoshop), le due immagini che si alterneranno al passaggio del mouse e salvarle in formato .GIF o .PNG.
.
.
Ecco le immagini che ho creato io. la PRIMA
TUTORIAL CREARE UN ROLLOVER CON PHOTOSHOP
28 dicembre 2009 - Fonte: http://www.trucchi-computer.com/blog
Un rollover è un pulsante o un’immagine che cambia aspetto quando il mouse si posa su di esso. Per creare un rollover sono necessarie due immagini: la prima che corrisponde all’originale, e una seconda che corrisponde all’immagine modificata.
Per creare queste immagini potete usare i livelli, differenziando quindi l’immagine in due livelli e modificando colore, tonalità e quant’altro voi vogliate. Per fare ciò trascinate il pulsante su Nuovo Livello oppure potete clikkare sul menù in alto Livello-Duplica Livello.
Usate gli stili dei pulsanti...
Leggi il seguito »
Effetto rollover in bianco e ner con CSS e jQuery
25 settembre 2009 - Fonte: http://www.markdvl.com
Qualche mese fa James Padolsey ha realizzato una tecnica per emulare l’effetto "scala di grigio" da applicare sulle immagini nei browser non-IE come Firefox.
Partendo da questa tecnica sohtanaka è riuscito a modificarla attraverso l’uso dei CSS e qualche linea di codice jQuery che gli hanno permesso di realizzare un gradevole effetto di rollover...
Leggi il seguito »
Impostare l’aspetto dei collegamenti in Dreamweaver
8 maggio 2009 - Fonte: http://www.total-photoshop.com
Come appare un link in una pagina web? Colorato, in grassetto o sottolineato? Oppure la sottolineatura compare solo quando passiamo il mouse sopra il link determinando il tipico comportamento di “Rollover”?
A tutte queste domande risponde il video tutorial di questa settimana che spiega come personalizzare ed impostare l’aspetto dei collegamenti delle nostre pagine web in Dreamweaver attraverso le proprietà di pagina.
Come realizzare menu con effetto rollover con css e html
28 aprile 2009 - Fonte: http://www.howtoweb.it
Realizzare un menu in html e css è un’operazione molto semplice, utilizzando le liste abbiamo a disposizione diverse metodologie che permettono di cambiare lo stile solo con i css. Diventa invece problematico a volte utilizzare le pseudoclassi dinamiche dei link per ottenere effetti interattivi, in questo tutorial vediamo come affrontare gli incovenienti più comuni.Nelle liste tradizionali le regole css di norma servono solo a gestire la grafica o a cambiare la disposizione delle voci da verticale ad orizzontale con un display:inline; le problematiche possibili sono facilmente risolvibili gestendo l’altezza delle voci per internet explorer e ...
Leggi il seguito »
JavaScript: da Mocha a Cappuccino
22 aprile 2009 - Fonte: http://www.ilmacaco.com
Mi piace condividere con voi alcune considerazioni riguardo questo linguaggio che secondo me e’ contraddistinto da una storia strana.
Il mio ingresso in Internet risale al periodo in cui dovevi comporre quel lungo numero di telefono che iniziava con 702…e sperare che la mammina non tirasse su la cornetta sul piu’ bello.
Da lì a poco buttai giu’ il primo sito su quello spazio gratuito che era digilander, dove non esisteva il concetto di pagine interattive e dinamiche. La cosa piu’ virtuosa che potevi fare per darti delle arie con gli amici era il rollover delle immagini, ovvero fare dei pulsanti che quando ci passavi su col mouse ti davano l’impressione che si pigiassero sul serio.
Fare...
Leggi il seguito »
Bottoni gloss con Gimp e Inkscape
18 marzo 2009 - Fonte: http://softwarefreeandopensource.blogspot.com/
In questo tutorial vedremo come sia possibile realizzare bottoni con effetto gloss e pronti per il rollover con InkScape e Gimp, molto simili a quelli degli articoli Bottoni con rollover e Bottoni con rollover flessibili. Nella prima parte prepareremo un bottone singolo con Inkscape, per poi procedere con la realizzazione grafica dei due stati con Gimp.
Non saranno necessarie conoscenze dei due programmi per seguire il tutorial; sono entrambi freeware e multipiattaforma, ovvero disponibili per Window, Mac e Linux.
Siamo pronti ad iniziare la prima parte che realizzeremo con Inkscape. Ecco come si presenta il programma una volta lanciato:
Figura 1 - Il programma Inkscape appena lanciato
WordPress: Creative Social Bookmarking Menu
20 febbraio 2009 - Fonte: http://www.juliusdesign.net
Oggi vi segnalo un menu di Social Bookmarking in XHTML-CSS davvero originale da inserire nei nostri blog
Molto originale la scelta di visualizzare le varie icone dei Social Bookmarking sul rollOver del mouse
Installare il menu è molto semplice, infatti ci basterà aggiungere le classi nel nostro foglio di stile CSS e inserire il condice a seconda si voglia...
Leggi il seguito »
