Question

I have this JavaScript on my page to toggle a div and switching between two images

<script type="text/javascript">
 function toggleArchiv() {
  document.getElementById('cat').toggle();
  var image = document.getElementById('arrow');
  if (image.src == 'bullet_arrow_down.png')
   {
    image.src = 'bullet_arrow_up.png';
   }
   else
   {
    image.src = 'bullet_arrow_down.png';
   }
  }
</script>

Works fine on modern browsers, but IE keeps saying there is an error at that line

document.getElementById('cat').toggle();

So it doesn’t toggle the div and neither switches the image. What to do?

Answer 1

It looks to me like you’re using the PrototypeJS library. The library will add methods to DOM elements, in this particular case it’s adding HTMLElement.prototype.toggle. DOM prototyping is only supported in IE8 and later and it must be rendering in standards mode. In order to get it working in all browsers, use the $() method instead of getElementById():

$('cat').toggle();

http://api.prototypejs.org/dom/element/toggle/