Html:
<div class="tabs">
<ul>
<li><a id="tab_1" onclick="showTabContent(this.id);">Tab 1</a></li>
<li><a id="tab_2" onclick="showTabContent(this.id);">Tab 2</a></li>
<li><a id="tab_3" onclick="showTabContent(this.id);">Tab 3</a></li>
</ul>
</div>
<div class="tabContent" id="tabContent1">Content 1</div>
<div class="tabContent" id="tabContent2" style="display:none;">Content 2</div>
JavaScript:
<script>
function showTabContent(id){
$('.tabContent').css.('display','none');
if(id == "tab_1"){
$('#tabContent1').css.("display","block");
}elseif(id == "tab_2"){
$('#tabContent2').css.("display","block");
}else{
alert("Not Found");
}
}
</script>
No comments :
Post a Comment