sebuma/assets/js/common.js

  $(function(){
    $(".header--line--banner--wrap .close--btn").on("click", function(){
      $(".header--line--banner--wrap").addClass("actv");
      $("main").addClass("actv");
    });

    $(".header--contents").on("mouseenter", function(){
       $(this).addClass("actv");
    })
    $(".header--contents").on("mouseleave", function(){
      $(this).removeClass("actv");
    });

    $(".ham--btn").on("click", function(){
      $(".header--ham--wrap").addClass("actv");
    });

    $(".header--ham--wrap .ico--close").on("click", function(){
      $(".header--ham--wrap").removeClass("actv");
    });

    $('.ham--l li').each(function (index) {
      $(this).on('click', function () {
        $('.ham--l li').removeClass('actv');
        $(this).addClass('actv');

        $('.ham--r ul').removeClass('actv');
        $('.ham--r ul').eq(index).addClass('actv');
      });
    });

    const swiper = new Swiper('.main--visual', {
      loop: true,
      autoplay: {
        delay: 5000,
        disableOnInteraction: false,
      },
      navigation: {
        nextEl: ".prev--next--wrap .next--btn",
        prevEl: ".prev--next--wrap .prev--btn",
      },
      on: {
        slideChange: function () {
          // progress bar 업데이트
          const totalSlides = this.slides.length;
          const currentIndex = this.realIndex;
          const progressPercent = ((currentIndex + 1) / totalSlides) * 100;
          const progressBar = document.querySelector('.main--visual--progress .progress-bar');
          const progressText = document.querySelector('.main--visual--progress .progress-text');
          const progressTitle = document.querySelector('.main--visual--progress .progress-title');

          if (progressBar) {
            progressBar.style.background = `linear-gradient(to right, #000 ${progressPercent}%, rgba(0,0,0,0.15) ${progressPercent}%)`;
          }
          if (progressText) {
            progressText.textContent = `${(currentIndex + 1)}`;
          }
          if (progressTitle && this.slideTitles && this.slideTitles[currentIndex]) {
            progressTitle.textContent = this.slideTitles[currentIndex];
          }
        },
        init: function () {
          // 초기 progress bar 설정
          const totalSlides = this.slides.length;
          const progressBar = document.querySelector('.main--visual--progress .progress-bar');
          const progressText = document.querySelector('.main--visual--progress .progress-text');
          const progressTitle = document.querySelector('.main--visual--progress .progress-title');
          const progressTotal = document.querySelector('.main--visual--progress .progress-total');

          if (progressBar) {
            progressBar.style.background = `linear-gradient(to right, #000 ${(1 / totalSlides) * 100}%, rgba(0,0,0,0.15) ${(1 / totalSlides) * 100}%)`;
          }
          if (progressText) {
            progressText.textContent = `1`;
          }
          if (progressTotal) {
            progressTotal.textContent = `${totalSlides}`;
          }
        }
      }
    });

    $(".play--btn").on("click", function(){
      if ($(this).hasClass("pause")) {
        swiper.autoplay.start();
        $(this).removeClass("pause");
      } else {
        swiper.autoplay.stop();
        $(this).addClass("pause");
      }
    });

    // FAQ 아코디언 - 단일선택
    $(".faq--section .question--wrap").on("click", function(){
      const $qnaWrap = $(this).closest(".qna--wrap");

      if ($qnaWrap.hasClass("active")) {
        $qnaWrap.removeClass("active");
      } else {
        $(".faq--section .qna--wrap").removeClass("active");
        $qnaWrap.addClass("active");
      }
    });
  });