Resolving a JavaScript conflict
<p>On a website, <a href="http://imgthis.com/blog/?p=34" rel="nofollow">http://imgthis.com/blog/?p=34</a>, I have two JavaScripts that load inside an iframe with an image gallery, one is lytebox which is a Light Box 2 slimmed down clone for image gallery pop ups and the other is a show only one div in a stack of divs. The lytebox script works until the show only one is invoked, from that point on it's broken in IE FF and Opera (Chrome and Safari do not throw an error) with this error:</p>

<pre>
Uncaught exception: TypeError: Cannot convert 'window.parent.frames[window.name]' to object Error thrown at line 223, column 1 in (imageLink, doSlide, doFrame) in [url to script]:
    var anchors = (this.isFrame) ? window.parent.frames[window.name].document.getElementsByTagName('a') : document.getElementsByTagName('a');
called from line 204, column 56 in () in [url to script]:
    myLytebox.start(this, false, false);
</pre>

<p>After it breaks you have to reload the page to get anything working again.</p>

<p>I'm assuming that it's a conflict, since it's only occurring after the other script has been invoked. Before the show only one is invoked it works perfectly.</p>

<p>This is the show only one code which is embedded into the page:  </p>

<pre><code>function showonlyone(thechosenone) {  
  var newboxes = document.getElementsByTagName('div');  
        for(var x=0; x&lt;newboxes.length; x++) {  
              name = newboxes[x].getAttribute('name');  
              if (name == 'newboxes') {  
                    if (newboxes[x].id == thechosenone) {  
                    newboxes[x].style.display = 'block';  
              }
              else {  
                    newboxes[x].style.display = 'none';  
              }
        }
 }
}
</code></pre>

<p>I'm pretty lost as to how they could be conflicting since they are looking for different elements, though my JavaScript isn't that strong so maybe it makes all the difference in the world.</p>
