ai eu até mudo o codigo.. mas não acontece nada no cabeçalho..
ele permanece com a imagem do #outer-wrapper { background….”

O que eu faço?
Se puderem me ajudar…

Muito obrigado pelo Tutorial.. ele está otimo!

var bg= new Array() // cria um vector (Array) chamado bg
// de seguida vamos preencher as posições do vector
bg[0]=”imagem/bg1.jpg”
bg[1]=”imagem/bg2.jpg”
bg[2]=”imagem/bg3.jpg”

var random=Math.round(2*Math.random()); // aqui é criado um numero aleatório entre 0 e 2 que será relativo á posição do vector (array)
// de seguida vamos escrever o código na página
// banner[random] significa o vector banner na posição random definida anteriormente

document.write(“”);
document.write(“#head{“);
document.write(‘background: url(“‘+ bg[random] +’”) no-repeat;’);
document.write(“}”);
document.write(“”);

/* —– HEADER —– */

#header-wrapper {
margin: 7px 0px 7px 0px;
padding: 4px;
width: 970px;
background: $headerbgColor;
border: 1px solid $headerBorderColor;
}

#header {
width: 970px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: left;
}

#header h1 {
color: $blogTitleColor;
font: $blogTitleFont;
font-variant: small-caps;
margin: 0px 0px 0px 0px;
padding: 10px 20px 0px 20px;
}

#header h1 a {
text-decoration: none;
color: $blogTitleColor;
}

#header h1 a:hover {
text-decoration: underline;
color: $blogDescriptionColor;
}

#header .description {
color: $blogDescriptionColor;
font: $blogDescriptionFont;
margin: 0px 0px 0px 0px;
padding: 1px 20px 25px 20px;
}

#header h1 p, #header .description p {margin:0;padding:0}

#header a img {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
border: 0;
}