Cacher is the code snippet organizer for pro developers

import { TweenMax, CSSPlugin } from 'gsap';

export function initTabs() {
  const $tabs = $('.js-tabs');

  $tabs.each(function() {
    const $this = $(this);
    const $tabsNav = $this.find('.tabs__nav > button');
    const $tabsFor = $this.find('.tabs__for > div');
    const speed = 0.7;

    $tabsNav.each(function() {
      const $that = $(this);
      if ($that.hasClass('is-active')) {
        $that.trigger('click');
        showContent($tabsFor.eq($that.index()));
      }
    });

    $tabsNav.on('click', function() {
      $tabsNav.removeClass('is-active').eq($(this).index()).addClass('is-active');
      $tabsFor.siblings().removeClass('is-active');
      showContent($tabsFor.eq($(this).index()).addClass('is-active'), hideContent($tabsFor.siblings().not('.is-active')));
    });

    function showContent(el) {
      TweenMax.set(el, { height: 'auto', scaleY: 1, scaleX: 1 });
      TweenMax.from(el, speed, { height: 0, scaleY: 0.8, scaleX: 0.8 });
    }

    function hideContent(el) {
      TweenMax.to(el, speed, { height: 0, scaleY: 0.8, scaleX: 0.8 });
    }
  });
}