PHP Code:
function ShowImg(a) {
var background = document.getElementById("background");
if (a.id=='1'){
background.style.backgroundImage="url(images/banner.png)";
}
else if(a.id=='2') {
background.style.backgroundImage="url(images/text.png)";
}
else{
background.style.backgroundImage="url(images/bannerthin.png)";
}
};
HTML Code:
<a href="#" id="1" onmouseover="ShowImg(this)" onmouseout="Backstep()">1</a>
<a href="#" id="2" onmouseover="ShowImg(this)" onmouseout="Backstep()">2</a>
This should make it working using your code, but I would suggest something like this instead :
PHP Code:
function ShowImg(img) {
var background = document.getElementById("background");
background.style.backgroundImage="url(images/" + img + ".png)";
};
HTML Code:
<a href="#" id="1" onmouseover="ShowImg('banner')" onmouseout="Backstep()">1</a>
<a href="#" id="2" onmouseover="ShowImg('text')" onmouseout="Backstep()">2</a>
<a href="#" id="3" onmouseover="ShowImg('bannerthin')" onmouseout="Backstep()">3</a>
Basically give the name of the image you want to appear as a parameter to the function, and do the replace.
Hope this helps