How can i create tab system using jQuery

Creating a simple tab-switching system using jQuery is super easy. No need to use any jQuery plugin for that. Just use simple jQuery and use some CSS like the one below:

//Start jQuery part
      	$( ".cmn" ).hide();
     	$( ".cmn" ).eq( $(this).index() ).show();
//jQuery part end

//Start CSS part
//CSS part end

// Start HTML part
<div class="container">


<div class="class1 cmn">Tab1 content</div>
<div class="class2 cmn">Tab2 content</div>
<div class="class3 cmn">Tab3 content</div>
<div class="class4 cmn">Tab4 content</div>

//End HTML part

Here is the output of the above code:

jQuery Tabs

Leave a Reply

Your email address will not be published. Required fields are marked *