PDA

View Full Version : Problem with changing background using javascript onClick


crossd
31 Aug 2011, 11:51 AM
Here is my script -- Applied in <head>


<script language="JavaScript">
var bgImage = new Array(); // don't change this

bgImage[0] = "images/aboutus_1.jpg";
bgImage[1] = "images/1.jpg";
bgImage[2] = "images/2.jpg";
bgImage[3] = "";

function changeBG(bgImage)
{
document.body.background = backImage;
}

</script>

[B]
And here is the code im using that is not working within <body>


<body>

<div id="map"></div>
<div id="bf_container" class="bf_container">
<div id="bf_background" class="bf_background">
<img id="bf_background" src="images/background/default.jpg" alt="image1" style=" display:none;"/>

<div class="bf_overlay"></div>
<div id="bf_page_menu" class="bf_menu" >
<h1 class="title">Fujiyama<span>Japanese</span></h1>
<ul>
<li><a href="#" onClick="javascript:changeBG(0)" data-content="home"><span class="bf_background"></span><span>Welcome</span></a></li>
<li><a href="#" onClick="javascript:changeBG(0)" data-content="about"> <span class="bf_hover"></span><span>About us</span></a></li>


this goes on, however, it does not change the background when clicking on "Welcome" or "About us" Links.

Any help would be greatly appreciated.

Thanks,

Cross
TheMichael
01 Sep 2011, 12:37 AM
var bgImage = new Array(); // don't change this

bgImage[0] = "images/aboutus_1.jpg";
bgImage[1] = "images/1.jpg";
bgImage[2] = "images/2.jpg";
bgImage[3] = "";

function changeBG(bgImageIndex) {
document.body.background = bgImage[bgImageIndex];
}

Let me know if you have questions about why this works and yours didn't. :)