body background change genom klickning ?

vagannMedlem sedan juli 2011167 inlägg

12 sep. 2011 17:32#1

hejsan

jag skulle behöva hjälp med denna JS koden , är det ´nån som ser vart felet är ?

<HEAD>
<SCRIPT LANGUAGE="JavaScript">

var backImage = new Array(); // don't change this

// Enter the colors you wish to use. Follow the
// pattern to use more colors.  The number in the
// brackets [] is the number you will use in the
// function call to pick each color.

backImage[0] = 'http://www.annatroberg.com/wp-content/uploads/2010/01/fb.jpg';
backImage[1] = 'http://www.wonderbackgrounds.com/glitter/backgrounds/glitter_background_b4.gif';
backImage[2] = 'http://www.psdgraphics.com/wp-content/uploads/2009/05/abstract-purple-background.jpg';
backImage[3] = 'http://a.dryicons.com/files/graphics_previews/retro_blue_background.jpg';

// Do not edit below this line.

function changeBG(whichImage){
document.bgImage = backImage[whichImage];
}
//  End -->
</script>
</HEAD>
<BODY>
<!--
Example Two -- changing bg color with a mouse click.
Set the number in the () in the changeBG() function
to the number of the color in the brackets in the
backColor[] array to select a given color.
//-->

<a href="javascript:changeBG(0)">bg1</a>
<a href="javascript:changeBG(1)">bg2</a>
<a href="javascript:changeBG(2)">bg3</a>
<a href="javascript:changeBG(3)">bg4</a>

voigtann1Medlem sedan juni 20018 810 inlägg

12 sep. 2011 18:06#2

firefox har inget bgImage, bara bgColor så förmodligen är detta IE specifikt om något

Sätt hellre CSS på din body:

document.getElementsByTagName("body")[0].style.backgroundImage="url(" + backImage[whichImage] + ")";

Sen hade jag nog övervägt att skriva om "new array" och koden till lite mer modern tänkt:

var backImage = [
	'http://www.annatroberg.com/wp-content/uploads/2010/01/fb.jpg',
	'http://www.wonderbackgrounds.com/glitter/backgrounds/glitter_background_b4.gif',
	'http://www.psdgraphics.com/wp-content/uploads/2009/05/abstract-purple-background.jpg',
	'http://a.dryicons.com/files/graphics_previews/retro_blue_background.jpg'
];

function changeBG(whichImage){
	document.getElementsByTagName("body")[0].style.backgroundImage="url(" + backImage[whichImage] + ")";
}