Effetti speciali di Pasqua da inserire nel blog.

Come installare nel blog di Blogger bellissimi effetti pasquali per abbellirlo in occasione delle feste.

Continuo la presentazione di effetti particolari che servono per abbellire il blog in occasione delle festività. Chi mi segue assiduamente avrà già letto i post che ho dedicato a Halloween, a Natale, a Capodanno, a San Valentino e all'Equinozio di Primavera. Con questo articolo vado a presentare dei semplici effetti da installare nel blog in occasione delle prossime festività pasquali. Si tratta di javascript adattati dal classico effetto di Dynamic Drive della neve che cade su cui si basano molti altri script.

Gli effetti sono stati testati per blog su piattaforma Blogger ma possono essere inseriti in qualsiasi pagina web che supporti il javascript.

EFFETTI DI CADUTE DI OGGETTI PASQUALI

Nel caso di Blogger si va su Layout > Aggiungi una gadget > HTML/Javascript e in Sezioni del sito si incolla il codice. Si salva e si cerca di posizionare nella parte alta del layout tramite il drag & drop. I codici sono funzioni degli oggetti animati che vogliamo visualizzare

<script src="https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua1.js" type="text/javascript"/></script>

per avere una cascata di queste uova . Per avere altri effetti basterà sostituire il javascript colorato di rosso con uno dei seguenti:
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua2.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua3.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua4.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua5.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua6.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua7.js per questa imm
https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/pasqua8.js per questa imm

Si possono usare anche altre immagini avendo l'accortezza di modificare il javascript in questo modo. Si apre incollandone l'URL nel browser, si clicca sulla pagina e si sceglie Salva con nome….  Successivamente si apre con un Editor quale Notepad++ e si sostituisce l'URL della immagine con quello di un'altra precedentemente caricata su Picasa o Google Photos.

Ho postato una dimostrazione dell'effetto con l'ultima immagine animata

EFFETTO DI TRE IMMAGINI ANIMATE

Si può avere anche un effetto un po' più complicato dato da tre immagini pasquali animate che si muovono casualmente nel layout del nostro blog. Per avere una idea date un'occhiata a questa pagina

Per avere questo effetto andate su Modello > Modifica HTML e cercate la riga </head>. Subito sopra a questa va incollato questo codice

<!--Effetto Pasqua Inizio-->
<script src='https://googledrive.com/host/0B5vupkCL4QrxZXk0QUpyZTRreTA/movimento.js' type='text/javascript'/>
<script type='text/javascript'> var immaginea, immagineb, immaginec
function pagestart(){ immaginea=new ipcj1(&quot;immaginea&quot;,70,82);
immagineb=new ipcj1(&quot;immagineb&quot;,50,60);
immaginec=new ipcj1(&quot;immaginec&quot;,30,40);
idpceinmov3(&quot;immaginea&quot;);
idpceinmov3(&quot;immagineb&quot;);
idpceinmov3(&quot;immaginec&quot;);
} if (window.addEventListener)
window.addEventListener(&quot;load&quot;, pagestart, false)
else if (window.attachEvent)
window.attachEvent(&quot;onload&quot;, pagestart)
else if (document.getElementByid)
window.onload=pagestart </script>
<!--Effetto Pasqua Fine - www.ideepercomputeredinternet.com-->

Salvate il modello. Quindi su Layout > Aggiungi un gadget > HTML/Javascript va incollato quest'altro codice in Sezioni del sito per poi salvare.

<div id="immaginea" style="position:absolute; left: -300px; width:70; height:70;">
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKnMPSR3g7cZR7MHhub1DqdSBSYI5xCDkusygb-5kQvAh_ud3ylBr5ewsIbIaAtx9brfhIKiDjPNPsfayKCo2NcOtfwT0EzgiLZUCcwfE2eTwj2nJFsQ-14VYIzDX4q0ws53ZAT8YvMRE/" border="0" /></a></div>
<div id="immagineb" style="position:absolute; left: -400px; width:70; height:70;">
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUr-umvlK6o7v9ut-XkvPkKmAsN_bPxdqc1tRUSvTFQ-vvhyn2N5aQ2EMw9NJD4HRZI-pF09bKzEIpSjyvYCV4uX6wn9gIlHA10dYsARGoBHqExGcYK98C-TSwf5hFIc2MxORguUTUPJI/" border="0" /></a></div>
<div id="immaginec" style="position:absolute; left: -500px; width:70; height:70;">
<a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXAii1agOEsTAAJ_LbB80nQ54spgHPbwu2OqIhRtaX6KKf0AuGpXD81DG21i_vbc5lI73fmx9NJL93GYaCXOchL0F6Si78KDwlu3pgHy0v57rVq1wqMK4laB8ghM5WwtKjaErX5DgVdkk/" border="0" /></a></div>

L'elemento va posizionato preferibilmente nella parte alta del layout. Le tre immagini animate i cui URL sono colorati di rosso possono essere sostituite da altre di nostro gradimento.

EFFETTO DEI CAMPANELLI PASQUALI

Se si vuole qualcosa di diverso come mostrare dei campanelli pasquali come questi bisogna andare su Layout > Aggiungi un gadget > HTML/Javascript e incollare il seguente codice

• Codice dei campanelli pasquali -

Si salva e si posiziona in alto nel layout. Si possono settare alcuni parametri:

1. Il numero delle coppie di campanelli da visualizzare contemporaneamente
2. La velocità di spostamento delle immagini
3. La opacità  settata come 0.9 e 90. Nel caso vogliate una immagine più opaca mettete 0.8 e 80
4. L'URL della immagine da visualizzare che dovrà essere caricata sul vostro account Picasa

I prossimi widget stagionali li pubblicherò probabilmente prima dell'estate.