Changer dynamiquement le fond d'écran

Comment alterne le fond de la page, l'assigner au chargement et la changer ensuite à la demande de l'utilisateur?

Démonstration:

On crée un objet image et on assigne l'attribut src à l'attribut background de la balise body.
Voici le code pour assigner une image de fond:

var z = new Image(); 
z.src = "road.jpg"; 
document.body.background=z.src; 

Code HTML de la démonstration avec un bouton pour changer le fond:

<input type="button" onclick="changeImage()" value="Changer le fond d'écran" />

Code JavaScript complet:

<script type="text/javascript">
function changeImage()
{
  var v = document.body.background;
  if(v.indexOf("asin1") != -1)
    v = "https://www.xul.fr/images/asin2.jpg";
  else
    v = "https://www.xul.fr/images/asin1.jpg";

  var z = new Image();
  z.src = v;
  document.body.background = z.src;  
}
function setImage()
{
	var z = new Image();
	z.src = "https://www.xul.fr/images/asin1.jpg";
	document.body.background = z.src;
}
window.onload=setImage;
</script>

© 2007-2011 Xul.fr