1. Create a new snippets and pase the following code in it and include snippets where you want to display tabs.

<script
  src="https://code.jquery.com/jquery-3.5.1.js"></script>
<div class="kkduniya-desc">
   <ul class="kktabs clearfix">
       <li><a href="#tab-1" class="active">Details</a></li>
       <li><a href="#tab-2">How To</a></li>
       <li><a href="#tab-3">Ingredients</a></li>
       <li><a href="#tab-4">Shipping</a></li>
   </ul>
   <div class="kkduniya-content">
       <div id="tab-1" class="tab active">
                Enter Product Description Over Here.
       </div>
       <div id="tab-2" class="tab">
                Enter how to use of products details, etc.
       </div>
       <div id="tab-3" class="tab">
                Enter product ingredients details over here.
       </div>
       <div id="tab-4" class="tab">
                Enter shopping information.
       </div>
   </div>
 </div>

<script>
 $(document).ready(function() {
   $('ul.kktabs').each(function(){
     
     var active, content, links = $(this).find('a');
      active = links.first().addClass('active');
      content = $(active.attr('href'));
     
     links.not(':first').each(function () {
        $($(this).attr('href')).hide();
     });
     
     $(this).find('a').click(function(e){
       active.removeClass('active');
       content.hide();
       active = $(this);
       content = $($(this).attr('href'));
       active.addClass('active');
       content.show();
       return false;
     });
     
   });
 });
 </script>

<style>
 
 .kkduniya-desc ul.kktabs{
   margin: 0px;
   padding: 0px;
   border-radius: 0px;
   top: 1px;
   position: relative;
 }

 .clearfix{
  clear: both;
 }
 
 .kktabs li{
   background-color: #fff;
   display: inline;
   position: relative;
   z-index: 0;
   border-radius: 0px;
   margin: 0 -5px;
   padding: 0;
 }
 
 .kkduniya-desc ul li:first-child{
    margin: 0px;
 }
 
 .kkduniya-desc ul li a{
   display: inline-block;
   border: 1px solid #e9e9e9;
   padding: 1.2em 1em;
   font-weight: 700;
   color: #515151;
   text-decoration: none;
   font-size: 12px;
   text-transform: uppercase;
 }
 
 .kkduniya-desc ul li a.active{
   background: #ded9d9ee;
   border-bottom-color: #fafafa;
 }
 
 .kkduniya-desc .tab{
   display: block;
   border: 1px solid #e9e9e9;
   padding: 15px;
   background: #fafafa;
   font-size: 14px;
   border-radius: 0px;
 }
 </style>

0 Comments

Leave a Comment

jojobetmedyum fermanmedyummedyum simonmedyum kalendermedyum cozum
HacklinkHair Transplant istanbul
da pa kontrolü
marsbahis giriÅŸ
Vozol Puff
iqos terea
instagram takipçi
takipçi
antalya escort
ankara escort
bursa escort
izmit escort
viagra
kavbet
bahçelievler nakliyat
istanbul evden eve nakliyat
istanbul bahçelievler evden eve nakliyat
hair transplant
istanbul anlık haberler
extrabet
extrabet güncel
deneme bonusu
deneme bonusu veren siteler
deneme bonusu veren siteler
bonus veren siteler
grandpashabet güncel giriş
grandpashabet
grandpashabet
grandpashabet
grandpashabet
https://tipobet.bet/
deneme bonusu veren siteler
casibom
casibom giriÅŸ
casibom
casibom giriÅŸ
gamdom giriÅŸ
sightcare
marsbahis
grandbetting güncel giriş
gamdom
romabet
romabet
romabet
holiganbet
casibom giri?casibom giri?casibomjojobetjojobetlunabetjojobetjojobet giri?jojobet giri?fixbetfixbet g�ncel giri?jojobetjojobetjojobetfixbetcasibom giri?casibom giri?casibom giri?casibom giri?casibom giri?casibom giri?ravenbahiscasibom giri?casibombetebetpusulabett�mbetbets10matbetperabet