So I have a conflict, and I know where it is. But I don't know how to resolve it without breaking the script. I had this in the free forum on accident. I am a pro user. I'm using the HighSlide pop-up engine, but have seen the conflict on multiple engines.
The site we're having issues on is
www.hitchcarriers.com/index.php?page=shop.product_details&flypage=flypage.tpl&product_id=21&category_id=1&option=com_virtuemart&Itemid=1
.
Here's the conflicting code:
//Script for tabbed boxes on the product pages
function hidestories() {
var divs=document.getElementById('stories').getElementsByTagName('div');
for (j=0; j<divs.length; j++) {
var rE = new RegExp("(^|\\s)" + 'story' + "(\\s|$)");
if (rE.test(divs[j].className)) {
divs[j].style.display="none";
}
}
}
function stories(first) {
var thebuttons=document.getElementById('thebuttons').getElementsByTagName('a');
for (i=0; i<thebuttons.length; i++) {
thebuttons[i].onclick=function() {
hidestories();
var thestory=(this.href).split("#",2)[1];
document.getElementById(thestory).style.display="block";
var active=document.getElementById('activeTab');
active.id="";
this.parentNode.id="activeTab";
return false;
}
}
if (first) {
var firstone=document.getElementById('stories').firstChild;
if (firstone.nodeType != 1) {firstone = firstone.nextSibling;}
firstone.style.display="block";
var firstlink=document.getElementById('thebuttons').firstChild;
if (firstlink.nodeType != 1) {firstlink = firstlink.nextSibling;}
firstlink.id="activeTab";
}
}
window.onload=function() {
if (document.getElementById('thebuttons')){
hidestories();
stories(1);
}
}
I can resolve the conflict by commenting out any of the following lines:
for (i=0; i<thebuttons.length; i++) {thebuttons[i].onclick=function() {
If I comment out the for loop, or if statement, the conflict is resolved. But if I comment everything within the for loop or if statement, it isn't. So somehow the if statement and for loop themselves are causing the conflict. I just don't know how.
Any help would be greatly appreciated.
