I'm trying to figure out why some of the ajax tabs are not working. The first two tabs work, the third through 5th tabs do not work when you click on them.
The js contains:
The css contains:Code:// JavaScript Document function tab(){ var labels=document.getElementById("tab_product").getElementsByTagName("li"); var part_1=document.getElementById("part_1"); var part_2=document.getElementById("part_2"); var part_3=document.getElementById("part_3"); var part_4=document.getElementById("part_4"); var part_5=document.getElementById("part_5"); labels[0].onclick=function(){ this.className="sel"; labels[1].className=""; part_1.className="show"; part_2.className="hide"; part_3.className="hide"; part_4.className="hide"; part_5.className="hide"; } labels[1].onclick=function(){ this.className="sel"; labels[0].className=""; part_1.className="hide"; part_2.className="show"; part_3.className="show"; part_4.className="show"; part_5.className="show"; } }
The body contains:Code:/*===product column start*/ #prod_column {height:36px;margin-bottom:6px;background:url(images/prod_column_bg.png) repeat-x top;margin:8px 0;} #prod_column .left,#prod_column .right {float:left;width:5px;height:31px;background:url(images/prod_column_side.png) no-repeat left top;} #prod_column .right{float:right;background-position:0 -34px;} #prod_column ul li {float:left;} #prod_column ul li a {display:block;width:138px;height:27px;margin:4px 1px 0 1px;background:url(images/prod_column.png) no-repeat;font-size:12px;line-height:26px;text-align:center; cursor:pointer;} #prod_column ul li a.sel {display:block;width:138px;height:32px;background:url(images/prod_column.png) no-repeat 0 -30px;color:#fff;} #prod_column ul#tab_product li{display:block;width:138px;height:27px;margin:4px 1px 0 1px;background:url(images/prod_column.png) no-repeat;font-size:12px;line-height:26px;text-align:center; cursor:pointer;} #prod_column ul#tab_product li.sel {display:block;width:138px;height:32px;background:url(images/prod_column.png) no-repeat 0 -30px;color:#fff;} /*===tab start===*/ #tab li,#tab_buy li {float:left; cursor:pointer;} #tab li,#tab_buy li{display:block;width:231px;height:27px;margin-right:1px;background:url(images/prod_single_column.png) no-repeat;line-height:24px;text-align:center;font-size:12px;} #tab li.margin,#tab_buy li.margin {margin-right:0;} #tab li.sel {height:32px;background-position:0 -33px;color:#FFF;} #tab_buy li.sel {height:32px;background-position:0 -108px;color:#FFF;} #tab_buy li {width:347px;background-position:0 -73px;} .show {display:block;} .hide {display:none;}
http://tinypaste.com/10292
Your help is appreciated. Thanks.



Reply With Quote
Bookmarks