Wednesday, March 31, 2010

Very simple Tab javascript

I've used three tabs for example. You can add any number of tabs by changing "i" value.


<script type="text/javascript">
function changeit(a) {
for(i=1; i<=3; i++) {
if(i==a) {
document.getElementById("block"+i).style.display="block";
document.getElementById("t"+i).className="tab";
} else {
document.getElementById("block"+i).style.display="none";
document.getElementById("t"+i).className="";
}
}
}
</script>


Into the body tag

<a href="#" id="t1" onClick="changeit(1)" class="tab">tab1</a>
<a href="#" id="t2" onClick="changeit(2)">tab2</a>
<a href="#" id="t3" onClick="changeit(3)">tab3</a>
<div id="block1">test blcok1</div>
<div id="block2" style="display:none;">test block2</div>
<div id="block3" style="display:none;">test block3</div>


Any doubts reply me ! thanks

No comments: