Sfondo fisso con Javascript

20-01-2009, 15.49.05

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

**saitfainder** · 20-01-2009, 16.12.08

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

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!

**dementialsite** · 21-01-2009, 12.08.46

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...

Discussione: Sfondo fisso con Javascript

LinkBack

Strumenti discussione

Display

Sfondo fisso con Javascript

Regole di scrittura