changing tables background

taval · Jan 20, 2001

I have got this code that changes an image from one image to the another when a trigger image is pressed. The thing is a want a tables background to change everytime the trigger image is pressed. I would be very grateful if any one could help me out. Thanks.

----------------------------------------
<script>
arraySrc = new Array();
arraySrc[0] = "images/taha_head.gif";
arraySrc[1] = "images/taha_head2.gif";

var x1 = 0;

function change1(target)
{
if(x1 >= arraySrc.length)
{
x1 = 0;
}
document.images[target].src = arraySrc[x1];

x1++;
}

</script>

// trigger image code
<img SRC="images/arrow_logo.gif" height=100 width=100 onclick="change1('ben');" >

<img name="ben" src="images/taha_head.gif"></td>

-----------------

RobSchultz · Jan 20, 2001

Here is a template you could use...

Code:

<html>
<head>
<style type=&quot;text/css&quot;>
 .bkg1{background-color:#ffff00;}
 .bkg2{background-color:#00ffff;}
</style>
<script language=&quot;javascript&quot;>
 var tblBkg = 1;
 
 function BkgSwitch(){
  if (tblBkg==1){
   tblBkg = 2;}
  else{
   tblBkg = 1;
  }
  document.all.tblDemo.className = &quot;bkg&quot; + tblBkg;
 }
</script>
</head>
<body>
 <table id=tblDemo class=&quot;bkg1&quot;><tr><td>This is a table</td></tr></table>
 <br><input type=button onClick=&quot;BkgSwitch()&quot; value=&quot;Change color&quot;>
</body>
</html>

Later Rob
robschultz@yahoo.com
-Focus on the solution to the problem, not the obstacles in the way.-

taval · Jan 21, 2001

Thanks Rob, I think the code you have given just changes the background color but I was wondering how on how to change the background images from one to another.

GIGN · Jan 21, 2001

You are not actually using background images? set a table cell BG ig like:

<td id="cell_1" style="background-image:url('iages/arrow_logo.gif');background-repeat:no-repeat">

Then you can change these thru a function and changing the property:

document.all.elementID.style.backgroundImage ="url('images/taha_head.gif')"

//or for NN

document.layers.elementID.backgroundImage ="url('images/taha_head.gif')"

I'll leave you to work out the details. Ben
"Alright whatever man, I'll hook up the hair, but I aint touchin the ring...Cause I'm still a pla--yer"

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

changing tables background

taval

Programmer

RobSchultz

Programmer

taval

Programmer

GIGN

Programmer

Similar threads

Part and Inventory Search

Sponsor