Header a rotazione casuale nel nostro blogger

Header a rotazione casuale nel nostro blogger

Oggi vi mostrerò come far comparire in maniera casuale l'header del nostro blogspot.

Type your summary here.

1- Come al solito scaricate e salvate una copia del vostro template.
2- Cercate nel codice css subito dopo il tag </header> ,qui cercate il seguente codice:

#header {
background:#476 url("http://www.miosito.com/1header.jpg") no-repeat left bottom;
margin:0 0 0;
padding:0 0 8px;
color:#fff;
}

Se non trovate il codice propio uguale, cercate di capire quale parte del css equivale al vostro header. Credo che sia chiaro, andiamo ad impostare uno sfondo nel nostro header tramite css.
3- Ora tornate subito dopo il tag <header> e incollate il la seguente porzione di codice:

<script type="text/javascript">
var banner= new Array()
banner[0]="http://miosito.com/1header.jpg"
banner[1]="http://miosito.com/2header.jpg"
banner[2]="http://miosito.com/3header.jpg"
banner[3]="http://miosito.com/4header.jpg"
banner[4]="http://miosito.com/5header.jpg"

var random=Math.round(4*Math.random());
document.write("<style>");

document.write("#header {");

document.write(' background:url("' + banner[random] + '") no-repeat left TOP;');

document.write(" }");

document.write("</style>");
</script>


Questo codice non è altro che un array in javascript che contiene come variabili i nostri header, e con var random andiamo a impostare i nosti header, il numero prima di math.random è 4 anche se i nostri header sono 5 questo perchè l'arrayi parte da 0 e non da 1.
Per i vostri header avrete bisogno di uno spazio, oppure basta che aprite in post bozza con blogspot caricate le immagini, e copiate il percorso con il tasto destro propietà.
buon divertimento.
Share This

Nessun commento:

Posta un commento

Seguici su

Google+ Followers

Lettori fissi

Designed By Blogger Templates