TEST-web-siteの4のJqueryコーディング

TEST 4のコーディングです。

jqueryのハンバーガー部分

/*ハンバーガナビの開閉*/
$(".openbtn").click(function () {
  //ボタンがクリックされたら
  $(this).toggleClass("active"); //ボタン自身に activeクラスを付与し
  $("#g-nav").toggleClass("panelactive"); //ナビゲーションにpanelactiveクラスを付与
});

$("#g-nav a").click(function () {
  //ナビゲーションのリンクがクリックされたら
  $(".openbtn").removeClass("active"); //ボタンの activeクラスを除去し
  $("#g-nav").removeClass("panelactive"); //ナビゲーションのpanelactiveクラスも除去
});


navi内のアコーディオン

/*navi内のアコーディオン階層*/
$(function () {
  //.accordion_oneの中の.accordion_headerがクリックされたら
  $(".s_01 .accordion_one .accordion_header").click(function () {
    //クリックされた.accordion_oneの中の.accordion_headerに隣接する.accordion_innerが開いたり閉じたりする。
    $(this).next(".accordion_inner").slideToggle();
    $(this).toggleClass("open");
  });
});


ヘッダーがスクロールすると隠れるjquery

/*ヘッダーのアニメーション*/
var _window = $(window),
  _header = $(".header"),
  heroBottom,
  startPos,
  winScrollTop;

_window.on("scroll", function () {
  winScrollTop = $(this).scrollTop();
  heroBottom = $(".mv").height();
  if (winScrollTop >= startPos) {
    if (winScrollTop >= heroBottom) {
      _header.addClass("hide");
    }
  } else {
    _header.removeClass("hide");
  }
  startPos = winScrollTop;
});

_window.trigger("scroll");


質問のアコーディオン開閉のjquery

//アコーディオンをクリックした時の動作
$('.title').on('click', function() {//タイトル要素をクリックしたら
  $('.box').slideUp(500);//クラス名.boxがついたすべてのアコーディオンを閉じる
    
  var findElm = $(this).next(".box");//タイトル直後のアコーディオンを行うエリアを取得
    
  if($(this).hasClass('close')){//タイトル要素にクラス名closeがあれば
    $(this).removeClass('close');//クラス名を除去    
  }else{//それ以外は
    $('.close').removeClass('close'); //クラス名closeを全て除去した後
    $(this).addClass('close');//クリックしたタイトルにクラス名closeを付与し
    $(findElm).slideDown(500);//アコーディオンを開く
  }
});

//ページが読み込まれた際にopenクラスをつけ、openがついていたら開く動作※不必要なら下記全て削除
$(window).on('load', function(){
  $('.accordion-area li:first-of-type section').addClass("open"); //accordion-areaのはじめのliにあるsectionにopenクラスを追加
  $(".open").each(function(index, element){ //openクラスを取得
    var Title =$(element).children('.title'); //openクラスの子要素のtitleクラスを取得
    $(Title).addClass('close');       ///タイトルにクラス名closeを付与し
    var Box =$(element).children('.box'); //openクラスの子要素boxクラスを取得
    $(Box).slideDown(500);          //アコーディオンを開く
  });
});


TOPをクリックで戻る。スクロールTOPのjquery

//スクロールした際の動きを関数でまとめる
function PageTopCheck(){
    var winScrollTop = $(this).scrollTop();
    var secondTop =  $("#area-2").offset().top - 150; //#area-2の上から150pxの位置まで来たら
    if(winScrollTop >= secondTop){
		$('.js-scroll-down').removeClass('scroll-view');//.js-scrollからscroll-viewというクラス名を除去
		$('.js-pagetop').addClass('scroll-view');//.js-pagetopにscroll-viewというクラス名を付与
	} else {//元に戻ったら
		$('.js-scroll-down').addClass('scroll-view');//.js-scrollからscroll-viewというクラス名を付与
		$('.js-pagetop').removeClass('scroll-view');//.js-pagetopからscroll-viewというクラス名を除去
	}
}

//クリックした際の動き
$('.scroll-top a').click(function () {
	var elmHash = $(this).attr('href'); //hrefの内容を取得
	if (elmHash == "#area-2") {//もし、リンク先のhref の後が#area-2の場合
		var pos = $(elmHash).offset().top;
		$('body,html').animate({scrollTop: pos}, 500); //#area-2にスクロール
	}else{
		$('body,html').animate({scrollTop: 0}, 500); //それ以外はトップへスクロール。数字が大きくなるほどゆっくりスクロール
	}
    return false;//リンク自体の無効化
});

// 画面をスクロールをしたら動かしたい場合の記述
$(window).scroll(function () {
	PageTopCheck();/* スクロールした際の動きの関数を呼ぶ*/
});

// ページが読み込まれたらすぐに動かしたい場合の記述
$(window).on('load', function () {
	PageTopCheck();/* スクロールした際の動きの関数を呼ぶ*/
});


swiperのjquery

const swiper = new Swiper(".swiper", {
  slidesPerView: 1,
  breakpoints: {
    1030: {
        slidesPerView: 2,
          },
    },
    centeredSlides : false,
    spaceBetween: 50, 

  // ページネーションが必要なら追加
  pagination: {
    el: ".swiper-pagination"
  },

  // ナビボタンが必要なら追加
  navigation: {
    nextEl: ".swiper-button-next",
    prevEl: ".swiper-button-prev"
  }
});


サイトは

こちらから