Sfondo fisso con Javascript

Printable View

20-01-2009, 15.49.05

Sfondo fisso con Javascript

Salve a tutti,
sto costruendo la mia prima pagina, sono un principiante.
Il mio problema: fino ad ora ho utilizzato il CSS per impostare lo sfondo tramite il seguente codice:

background-image: url(sfondo2.jpg); background-position: bottom; background-attachment:fixed; background-repeat: no-repeat;

Poi ho scoperto un javascript per randomizzare lo sfondo, e funziona:

</head>
<body >
<br /><br />
<div align="center">

<script>

var backgr1="sfondo2.jpg"
var backgr2="sfondo2.1.jpg"
var backgr3="sfondo2.2.jpg"

var cur=Math.round(6*Math.random())
if (cur<=1)
backgr=backgr1
else if (cur<=4)
backgr=backgr2
else
backgr=backgr3
document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">')
</script>

</div>
<br /><br /><br /><br /><br /><br />
<div align="center">

Il problema è che lo sfondo ora non è più fisso e si ripete. Come faccio a fissarlo?

Grazie
20-01-2009, 16.12.08
saitfainder

Lascia questo nel CSS:

Codice:

body { background-position: bottom; background-attachment:fixed; background-repeat: no-repeat; }
20-01-2009, 17.21.47

Funziona, grazie!
Un'altra cosa: nello script c'erano sono 3 sfondi random, ma io ne ho messi 5:

var backgr1="images/sfondi/sfondogrigio.jpg"

var backgr2="images/sfondi/sfondoblu.jpg"

var backgr3="images/sfondi/sfondogiallo.jpg"

var backgr4="images/sfondi/sfondorosso.jpg"

var backgr5="images/sfondi/sfondoverde.jpg"

Tuttavia randomizza solo fra i primi tre. Credo di dover aggiungere qualcosa qui:

var cur=Math.round(6*Math.random())
if (cur<=1)
backgr=backgr1
else if (cur<=4)
backgr=backgr2
else
backgr=backgr3
document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">')

Ma cosa? :!:
20-01-2009, 19.39.44

Sostituisci questa parte:

Codice:

var cur=Math.round(6*Math.random()) if (cur<=1) backgr=backgr1 else if (cur<=4) backgr=backgr2 else backgr=backgr3 document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">')

con

Codice PHP:

var cur=Math.round(5*Math.random()) switch(cur) { case 1: backgr = backgr1; break; case 2: backgr = backgr2; break; case 3: backgr = backgr3; break; case 4: backgr = backgr4; break; case 5: backgr = backgr5; break; } document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">');
21-01-2009, 12.05.44

Citazione:

Originalmente inviato da gabryhacker

Sostituisci questa parte:

Codice:

var cur=Math.round(6*Math.random()) if (cur<=1) backgr=backgr1 else if (cur<=4) backgr=backgr2 else backgr=backgr3 document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">')

con

Codice PHP:

var cur=Math.round(5*Math.random()) switch(cur) { case 1: backgr = backgr1; break; case 2: backgr = backgr2; break; case 3: backgr = backgr3; break; case 4: backgr = backgr4; break; case 5: backgr = backgr5; break; } document.write('<body background="'+backgr+'" bgcolor="#f0f0f0">');

Grazie mille!:lol:
21-01-2009, 12.08.46
dementialsite

Piccola correzione: non va scritto

Codice:

var cur=Math.round(5*Math.random())

ma

Codice:

var cur=Math.floor(5*Math.random()) + 1

Il motivo?
- Math.random() genera un numero casuale tra 0 (compreso) e 1 (escluso)
- moltiplicando per 5, si ottiene un numero compreso tra 0 (incluso) e 5 (escluso)
- arrotondando all'intero più vicino, se questo numero è minore di 0.5, si può ottenere 0, caso non previsto!
- perché si usa Math.floor() e non Math.ceil()? Perché esiste la remota possibilità che venga generato 0 come numero causale, che con ceil() sarebbe approssimato a 0. Con floor() invece non c'è la possibilità che ci sia un'approssimazione a 5, perché oltre il 5 non è generato nulla.

Ultima cosa, non di poco conto: lo script di gabryhacker assume che le 5 immagini siano visualizzate con la stessa probabilità, cosa che non era prevista nel tuo script originale (la probabilità era 1/6 per lo sfondo 1, 1/2 per lo sfondo 2, e 1/3 per lo sfondo 3).

Statemi bene...