Ragazzi, ho deciso di farvi questo articolo per farvi capire come abbiamo fatto l’effetto traslazione con javascript!

Bhe iniziamo subito..
Creiamo la nostra pag oppure modifichimone una già esistente! e nei tag heade inserite:

<html>
<head>
<script src=”http://security-dev.com/effetto.js” type=”text/javascript”></script></head>
<body>
<a onclick=”slide_effect.start(); return false;”>Apri la slide!</a>
<div id=”slide1″ style=”display:none”><div>TESTO CHE ANDRà NELLA SLIDE CHE APPARE CON L’EFFETTO</div></div>
<script type=”text/javascript”>
var slide_effect = new Spry.Effect.Slide(”slide1″, {duration:1000, from:’0%’, to:’100%’,toggle:true});
</script>
</body>
</html>

Ok, ora andiamo ad analizzare le parti Colorate :),
La parte in blu come avete capito è il posto dove si andrà ad inserire ciò che si vuole far comparire nella slide (tutto quello che vi pare: testo immagini collegamenti object ecc)
Noi nel nostro header abbiamo inserito l’img del logo :)
Ok, ora tocca alla parte rossa ! :D
Ma più precisamente a questa parte del codice:

duration:1000, from:’0%’, to:’100%’,toggle:true

Allora Duration sarebbe la durata di quanto ci mette ad aprirsi e a chiudersi la slide, from (Da) e To (a) sarebbero le dimensioni, per spiegarci mejo, la nostra PARTE Da uno 0% (ovvero che non fà vedere nulla) e quando clicki và al 100% (e visualizza l’intera immagine (imagine nel nostro caso..))

Bhe non c’è niente di più semplice ragazzi! Buon divertimento !

ATTENZIONE: NON FATE COPIA INCOLLA DA QUI DATO CHE LE ” ” DI WORDPRESS SONO DIVERSE! SE FATE COPIA INCOLLA SOSTITUITE LE ” ” CON QUELLE NORMALI (questo ovviamente vale anche per le ‘ ‘)

Security-dev.com