Changing <div> content not working.

[chris1606]

I have an image gallery that pops up an enlarged version of a picture when someone clicks on it. That bit works, but it should also load the picture's caption into the floating layer. Instead the caption remains unchanged and gives an "object doesn't support this property or method" dialog.

The code is as follows:

<script>
  function goBig(objNo, caption)
  {
  document.getElementById('floatdiv').style.visibility = 'visible';
  document.getElementById('floatimg').src = document.getElementById('i'+objNo).src;
  document.getElementById('dd1').style.visibility = 'hidden';
  document.getElementByID('floatTxt').innerHTML = caption;
  }
</script>

<a href="#" onClick="goBig('2','This is the caption');">
<img src="image.jpg" height="100" width="150" border="0" id="i2" />
</a>

<div id="floatdiv" [style code/closing javascript removed to keep things short]><img id="floatimg" src="blank.gif" style="width: 800px">
<br />
<div id="floatTxt">.</div>
Click on the image to close.</div>

Thanks in advance.

[Thevercad]

hi,

can you try the following code?

document.getElementByID('floatTxt').innerText = caption;

I think, this might work.

[chris1606]

Just tried that, it didn't work at first, but then I spotted the capital "D" in getElementById in my original code. :p.

All working now, cheers for the help.

[Thevercad]

Sorry about that mistake. I'm glad its working now. :-)