【2023年5月】WordPressプラグイン「Highlighting Code Block」【テーマSwell】

document.addEventListener('DOMContentLoaded', function () {
    var $tab = $('.tab2')
    var $tab__link = $('.tab2__link')
    var $tab_body_item = $('.tab2-body__item')
    $tab__link.on('click', function (e) {
      var target = $(e.currentTarget)
      //タブの中身の表示非表示
      var num = target.data('tab-body')
      $tab_body_item.removeClass('on')
      $('.tab2-body__item--' + num).addClass('on')
      //タブの表示非表示
      $tab.removeClass()
      $tab.addClass('tab2 tab2--' + num)
    })
  })  
document.addEventListener('DOMContentLoaded', function () {
    var $tab = $('.tab3')
    var $tab__link = $('.tab3__link')
    var $tab_body_item = $('.tab3-body__item')
    $tab__link.on('click', function (e) {
      var target = $(e.currentTarget)
      //タブの中身の表示非表示
      var num = target.data('tab-body')
      $tab_body_item.removeClass('on')
      $('.tab3-body__item--' + num).addClass('on')
      //タブの表示非表示
      $tab.removeClass()
      $tab.addClass('tab3 tab3--' + num)
    })
  })

document.addEventListener('DOMContentLoaded', function () {
    var $tab = $('.tab4')
    var $tab__link = $('.tab4__link')
    var $tab_body_item = $('.tab4-body__item')
    $tab__link.on('click', function (e) {
      var target = $(e.currentTarget)
      //タブの中身の表示非表示
      var num = target.data('tab-body')
      $tab_body_item.removeClass('on')
      $('.tab4-body__item--' + num).addClass('on')
      //タブの表示非表示
      $tab.removeClass()
      $tab.addClass('tab4 tab4--' + num)
    })
  })


$(function(){
  $('a[href^="#"]').click(function(){
    //スクロールのスピード
    var speed = 500;
    //リンク元を取得
    var href= $(this).attr("href");
    //リンク先を取得
    var target = $(href == "#" || href == "" ? 'html' : href);
    //リンク先までの距離を取得
    var position = target.offset().top;
    //スムーススクロール
    $("html, body").animate({scrollTop:position}, speed, "swing");
    return false;
  });
});