Fantasmi animati da inserire nel blog per Halloween.

Come mostrare dei fantasmi animati nel blog in occasione di Halloween.

Mancano ancora tre settimane prima di arrivare alla festività di Halloween che pur non facendo parte della nostra cultura ha ormai preso decisamente campo anche nel nostro paese.

Come mio solito in occasione delle feste più importanti pubblico delle proposte per abbellire il blog. E' sempre piuttosto difficile trovare qualcosa di originale che non sia stata già presentata negli anni scorsi. Ho pensato a dei fantasmi animati che svolazzano nel blog. Per questo effetto ho usato uno script di MaxxBlade in cui si possono inserire anche 5 oggetti che cadono. Ho però trovato solo due immagini in GIF che si prestavano ottimamente per questo effetto. Se ne possono però aggiungere altre come illustrato alla fine dell'articolo.

                                    

Dopo aver salvato il template si va su Modello > Modifica HTML > Procedi e si cerca la riga </head> . Subito sopra si incolla il codice seguente

<!-- Fantasmi per Halloween Inizio -->
<script>
//<![CDATA[
// Fall v2.0 By MaxxBlade - http://www.maxxblade.co.uk/fall
var fallObjects=new Array();function newObject(url,height,width){fallObjects[fallObjects.length]=new Array(url,height,width);}
var numObjs=10, waft=100, fallSpeed=6, wind=0;
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuBbjjw003-5nJq-rWFOmICYFZ40_snAAPqVtxcOZni8reiyekWFn1qRyF5C4OY0Zy9VXXU-Mu0AC5xzAamZUXqu2b7oZajLjgjiKRJJxPqC92BEhGCrJH9QzHK8M6vjJETxhf70pmzT7b/s156/ghost2b.gif",28,25);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg55LoN_NUUN7fxKeKpSA8RB4hFblEGOx9gw6V5iOY-Dm6RRC8fhNFSQ_6yTtAR_ve25-xcJgmgbspuU_Ra-FTA1LX3hloSVF-bEkUSwuM58WLzrNiYYXMrbfMgzAGnVujcRAwHhWS-3Tyg/s118/ghost2.gif",21,21);
function winSize(){winWidth=(moz)?window.innerWidth:document.body.clientWidth;winHeight=(moz)?window.innerHeight:document.body.clientHeight;}
function fallObject(num,vari,nu){
objects[num]=new Array(parseInt(Math.random()*(winWidth-waft)),-30,(parseInt(Math.random()*waft))*((Math.random()>0.5)?1:-1),0.02+Math.random()/20,0,1+parseInt(Math.random()*fallSpeed),vari,fallObjects[vari][1],fallObjects[vari][2]);
if(nu==1){document.write('<img id="fO'+i+'" style="position:absolute;z-index:99;background:none;border:0;padding:0;box-shadow:none;" src="'+fallObjects[vari][0]+'">'); }
}
function fall(){
for(i=0;i<numObjs;i++){
var fallingObject=document.getElementById('fO'+i);
if((objects[i][1]>(winHeight-(objects[i][5]+objects[i][7])))||(objects[i][0]>(winWidth-(objects[i][2]+objects[i][8])))){fallObject(i,objects[i][6],0);}
objects[i][0]+=wind;objects[i][1]+=objects[i][5];objects[i][4]+=objects[i][3];
with(fallingObject.style){ top=objects[i][1]+winOffset+"px";left=objects[i][0]+(objects[i][2]*Math.cos(objects[i][4]))+"px";}
}
setTimeout("fall()",31);
}
var objects=new Array(),winOffset=0,winHeight,winWidth,togvis,moz=(document.getElementById&&!document.all)?1:0;winSize();
for (i=0;i<numObjs;i++){fallObject(i,parseInt(Math.random()*fallObjects.length),1);}
window.onresize=winSize;fall();
//]]>
</script>
<!-- Fantasmi per Halloween Fine -->

Si salva il modello. Ho postato in rete la solita demo

I parametri colorati possono essere modificati con questo significato:

1. Si possono aggiungere altre righe newObject("URL.gif",28,25); per inserire altre GIF animate
2. numObjs=10, sono il numero di immagini visualizzate contemporaneamente
3. waft=100, sono il numero di pixel dei movimenti laterali durante la caduta
4. fallSpeed=6, è la velocità di caduta
5. wind=0 è la direzione del vento. Questo è un parametro importante per ottimizzare l'effetto in funzione del modello in cui è stato inserito. Con vento 0 i fantasmi cadono verticalmente. Se si mette un numero negativo (es: -2) cadranno a sinistra, se invece si mette un numero positivo (es: 1) cadranno verso destra. Si può settare il numero a seconda delle esigenze.

Ricordo altre personalizzazioni che ho in passato presentato per la festa di Halloween

1. Fiamme per Halloween -
2. Suoni paurosi per Halloween -
3. Fantasmi di Halloween -
4. Pipistrelli per Halloween -
5. Zucche animate per Halloween -

Questo effetto può essere inserito anche in blog su piattaforme diverse da Blogger.