Tab based content show hide in shopify

Kumar2573
Shopify Partner
168 8 21

<ul id="tab__{{ section.id }}" class="tabs">
<li>
<a id="tname_{{ section.id }}" href="#tab-{{ section.id }}-1" class="active">
{{ section.settings.id}}
</a>
</li>
<li><a id="tname_{{ section.id }}" href="#tab-{{ section.id }}-2">{{ section.settings.id }}</a></li>
</ul>

<!-- start content -->

<div class="tc_wrps pricing-tables-content var-c" id="anchor-link">
{% for block in section.blocks %}
<div id="tab-{{ section.id }}-{{ forloop.index }}" class="div-block-32 row" {% unless forloop.first %}style="display:none;"{% endunless %}>
testttt


</div>
{% endfor %}
</div>

 

 

<script>
$(document).ready(function() {
$('#tab__{{ section.id }} a').click(function(e){
e.preventDefault();
$(this).closest('.subs-warpper').find('.tabs li a').removeClass('active');
$(this).closest('.subs-warpper').find('.div-block-32').hide();
$(this).addClass('active');
var id = $(this).attr("href");
$(""+id).show();
return false;
});
});
</script>

Expert Shopify Plus & shopify Developer & Theme customizer
- If the problem is solved remember to click to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- jitendra3496@gmail.com | Skype :- jitendra2573_1
- Direct Hire me :- Direct Contact me
Replies 0 (0)