NazariyM
7/28/2017 - 2:39 PM

my accordion

my accordion

import {TweenMax} from 'gsap';
import {css} from "../modules/dev/_helpers";

export function initAccordion () {
  const $accordion = $('.accordion');

  $accordion.each(function () {
    const $item = $(this).find('.accordion__item');
    const $btn = $item.find('> div:first-child');
    const $content = $item.find('.accordion__content');
    const speed = 0.5;

    $item.each(function () {
      const $thisContent = $(this).find('.accordion__content');
      if ($(this).hasClass(css.active)) {
        showContent($thisContent);
      }
    });

    $btn.on('click tap', function () {
      const $selfItem = $(this).closest($item);
      const $selftContent = $selfItem.find($content);

      $item.not($selfItem).removeClass(css.active);
      $content.each(function () {
        if (!$(this).closest($selfItem).length) {
          hideContent($(this));
        }
      });
      $selfItem.toggleClass(css.active);

      if ($selfItem.hasClass(css.active)) {
        showContent($selftContent);
      } else {
        hideContent($selftContent);
      }
    });

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

    function hideContent(el) {
      TweenMax.to(el, speed, {height: 0, scaleY: 0});
    }
  });
};
+b.catalog-menu.catalog__menu.js-accordion
				+e.item.js-accordion-title
					+e.title Базовые ИТ решения
						+icon('icon-plus')
					+e.UL.content.js-accordion-content
						+e.LI
							+e.A(href='#!') Сетевая инфраструктура
						+e.LI
							+e.A(href='#!') Инженерная ИТ
						+e.LI
							+e.A(href='#!') инфраструктура
						+e.LI
							+e.A(href='#!') Системы безопасности
						+e.LI
							+e.A(href='#!') Бизнес приложения
						+e.LI
							+e.A(href='#!') Системы коллективной работы
						+e.LI
							+e.A(href='#!') Web сайты
						+e.LI
							+e.A(href='#!') Сервисное обслуживание

				+e.item.js-accordion-title.is-active
					+e.title Сложные ИТ решения
						+icon('icon-plus')
					+e.UL.content.js-accordion-content
						+e.LI
							+e.A(href='#!') Сетевая инфраструктура
						+e.LI
							+e.A(href='#!') Инженерная ИТ
						+e.LI
							+e.A(href='#!') инфраструктура
						+e.LI
							+e.A(href='#!') Системы безопасности
						+e.LI
							+e.A(href='#!') Бизнес приложения
						+e.LI
							+e.A(href='#!') Системы коллективной работы
						+e.LI
							+e.A(href='#!') Web сайты
						+e.LI
							+e.A(href='#!') Сервисное обслуживание

				+e.item.js-accordion-title
					+e.title Проектирование
						+icon('icon-plus')
					+e.UL.content.js-accordion-content
						+e.LI
							+e.A(href='#!') Сетевая инфраструктура
						+e.LI
							+e.A(href='#!') Инженерная ИТ
						+e.LI
							+e.A(href='#!') инфраструктура
						+e.LI
							+e.A(href='#!') Системы безопасности
						+e.LI
							+e.A(href='#!') Бизнес приложения
						+e.LI
							+e.A(href='#!') Системы коллективной работы
						+e.LI
							+e.A(href='#!') Web сайты
						+e.LI
							+e.A(href='#!') Сервисное обслуживание