/content/folder[@name='Samples']/folder[@name='Models']/package[@name='GO Data Warehouse (query)']/model[@name='model']
<span id="tabHeaders">
Tab 1Tab 2Tab 3Tab 4Tab 5
</span>
<span id="tabContent">
Tab 1
Tab 2
Tab 3
Tab 4
bla bla bla
<span>
<span id="styleMaker" style="display:none;">
Selected TabUnselected TabHover
</style>
<script>
/*init Tabs*/
var headersDiv=document.getElementById("tabHeaders");
var theHeaders=headersDiv.getElementsByTagName("span");
var contentDiv=document.getElementById("tabContent");
var allDivs=contentDiv.getElementsByTagName("div");
var theContent=new Array();
//theContent will contain all relevant divs
for(var di=0;di<allDivs.length;di++){
if(allDivs[di].parentNode.id&&allDivs[di].parentNode.id=="tabContent"){
theContent.push(allDivs[di]);
}
}
var theStyles=document.getElementById("styleMaker");
var allTabStyles=theStyles.getElementsByTagName("td");
var selectedTab=allTabStyles[0].style.cssText,
unselectedTab=allTabStyles[1].style.cssText,
hoverTab=allTabStyles[2].style.cssText;
/*first tab is selected bu default*/
theHeaders[0].style.cssText=selectedTab;
theHeaders[0].tabID=0;
for(var thi=1;thi<theHeaders.length;thi++){
theHeaders[thi].style.cssText=unselectedTab;
theHeaders[thi].tabID=thi;
theHeaders[thi].onclick=function(){clickTab(this.tabID);};
theHeaders[thi].onmouseover=function(){this.style.cssText=hoverTab;this.style.cursor="pointer";}
theHeaders[thi].onmouseout=function(){this.style.cssText=unselectedTab;this.style.cursor="default";}
}
for(var ci=1;ci<theContent.length;ci++){
theContent[ci].style.display="none";
}
/*tabs are now initiated*/
function clickTab(id){
//loop through headers
//alert(id);
for(var i=0;i<theHeaders.length;i++){
if(i!=id){
theHeaders[i].style.cssText=unselectedTab;
theHeaders[i].onclick=function(){clickTab(this.tabID);};
theHeaders[i].onmouseover=function(){this.style.cssText=hoverTab;this.style.cursor="pointer";}
theHeaders[i].onmouseout=function(){this.style.cssText=unselectedTab;this.style.cursor="default";}
}
else{
theHeaders[i].onmouseover="";
theHeaders[i].onmouseout="";
theHeaders[i].style.cssText=selectedTab;
}
}
//loop through content
for(var j=0;j<theContent.length;j++){
if(j!=id){
theContent[j].style.display="none";
}
else{
theContent[j].style.display="block";
}
}
}
</script>
tabbed report