Reflex 1.1: aggiungere effetto di riflessione alle immagini

image Nuova versione 1.1 della libreria Javascript Reflex con la quale è possibile aggiungere effetti di riflessione alle immagini. Il vantaggio di usare questa tecnica “non intrusiva” è la rapidità con cui è possibile aggiungere questi effetti senza dover spendere tempo nel realizzare effettivamente l’immagine di riflessione.
Questa versione è stata provata sui browser Mozilla Firefox 1.5+, Opera 9+, Safari e IE6. La minima dimensione supportata per un’immagine è 32×32. Una volta inclusa la libreiria:

1
<script type="text/javascript" src="reflex.js"></script>

Basta inserire class=”reflex” sulle immagini dove desideriamo applicare tale effetto. Sfruttando la proprietà dell’attributo class è possibile manipolare gli effetti di riflessione, il chè rende questa libreria davvero particolare. È possibile, infatti, distorcere anche l’immagine aggiungendo effetti 3D. Ad esempio ecco come aggiungere varie caratteristiche alla rilfessione:

1
<img class="reflex idistance16 iborder2 iheight24" width="200" alt="" src="images/example.jpg"/>

Per i dettagli vedi la documentazione sul sito ufficiale.

Sullo stesso sito è possibile scaricare numerosi altri effetti come Edge, Corner, Glossy e molti altri, tutti dedicati alle immagini.

6 commenti a: “Reflex 1.1: aggiungere effetto di riflessione alle immagini”

  1. 08 set, 2008 iJim:

    Spettacolo, ma dovo posso trovare un tutorial per sfruttare le immagini con javascript???

    RispondiQuota
  2. 08 set, 2008 Giovambattista Fazioli:

    @iJim: cosa intendi esattamente per “sfruttare le immagini”?

    RispondiQuota
  3. 10 set, 2008 iJim:

    Ciao, intendo proprio la manipolazione, effetti, ritocco dei bit ( come con un editor esadecimale ), ecc…, cose del genere!

    RispondiQuota
  4. 12 set, 2008 Giovambattista Fazioli:

    @iJim: non sono a conoscenza di strumenti Javascript di questo tipo. Esistono sicuramente in Flash o tramite un’interazione con strumenti Server. Può darsi che qualcosa di simile si stia sperimento tramite le Canvas… se trovo ti farò sapere.

    RispondiQuota
  5. 12 set, 2008 iJim:

    Grazie mille…

    RispondiQuota
  6. 28 set, 2008 Redemption:

    grazie, proprio lui cercavo :)

    RispondiQuota

Lascia un commento

TAG XHTML PERMESSI: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERIMENTO CODICE: 
<pre></pre> // blocco generico
					<code></code> // blocco generico
					[cc_actionscript][/cc_actionscript] // Actionscript
					[cc_actionscript3][/cc_actionscript3] // Actionscript 3
					[cc_css][/cc_css] // CSS Style Sheet
					[cc_html][/cc_html] // HTML
					[cc_js][/cc_js] // Javascript
					[cc_objc][/cc_objc] // Objective-C
					[cc_php][/cc_objc] // PHP
					[cc_sql][/cc_sql] // SQL


Stop SOPA