https://24murainfo.com/wp-a/wp-content/themes/cocoon-master/javascript.js?ver=7.1.2&fver=20260530093555

1/**
2 * Cocoon WordPress Theme
3 * @author: yhira
4 * @link: https://wp-cocoon.com/
5 * @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later
6 */
7/////////////////////////////////
8// JavaScriptコード
9/////////////////////////////////
10
11( function ( $ ) {
12  /////////////////////////////////
13  //TOPへ戻るボタン
14  /////////////////////////////////
15  var prevScrollTop = -1;
16  var $window = $( window );
17  $window.scroll( function () {
18    //最上部から現在位置までの距離を取得して、変数[scrollTop]に格納
19    var scrollTop = $window.scrollTop();
20    var threashold = 600;
21    var s1 = prevScrollTop > threashold;
22    var s2 = scrollTop > threashold;
23
24    // スレッショルドを跨いだ時のみ処理をする
25    if ( s1 ^ s2 ) {
26      if ( s2 ) {
27        // トップへ戻るボタンが見えている時
28        $( '.body' ).addClass( 'go-to-top-visible' );
29
30        // //[.go-to-to]をゆっくりフェードインする
31        // $('.go-to-top').fadeIn('slow');
32      } else {
33        //トップへ戻る間だけ追加したクラスを除去
34        $( '.go-to-top-common' ).removeClass( 'go-to-top-up' );
35        // トップへ戻るボタンが見えていない時
36        $( '.body' ).removeClass( 'go-to-top-visible' );
37
38        // //それ以外だったらフェードアウトする
39        // $('.go-to-top').fadeOut('slow');
40      }
41    }
42
43    prevScrollTop = scrollTop;
44  } );
45
46  //ボタン(.go-to-top-common)のクリックイベント
47  $( '.go-to-top-common' ).click( function () {
48    //トップへ戻る間だけクラスを追加
49    $( this ).addClass( 'go-to-top-up' );
50    //ページトップへ移動する
51    $( 'body,html' ).animate(
52      {
53        scrollTop: 1,
54      },
55      800
56    );
57  } );
58  //ボタン(.go-to-toc-common)のクリックイベント
59  $( '.go-to-toc-common' ).click( function () {
60    //目次へ移動する
61    $( 'body,html' ).animate(
62      {
63        scrollTop: $( '.entry-content .toc' ).offset().top,
64      },
65      800
66    );
67  } );
68
69  //検索ボタンクリックでフォーカスを入力エリアに移す
70  $( '#search-menu-input' ).change( function ( e ) {
71    var searchEdit = $( '#search-menu-content .search-edit' ).first();
72    if ( e.target.checked ) {
73      searchEdit.focus();
74    } else {
75      searchEdit.blur();
76    }
77  } );
78
79  //下にスクロールで管理パネルを隠す
80  //上にスクロールで管理パネルを表示
81  var adminMenu = $( '#admin-panel' );
82  var adminHeight = adminMenu.outerHeight();
83  var adminStartPos = 0;
84  $( window ).scroll( function () {
85    var adminCurrentPos = $( this ).scrollTop();
86    if ( adminCurrentPos > adminStartPos ) {
87      if ( adminCurrentPos >= 200 ) {
88        adminMenu.css( 'bottom', '-' + adminHeight + 'px' );
89      }
90    } else {
91      adminMenu.css( 'bottom', 0 );
92    }
93    adminStartPos = adminCurrentPos;
94  } );
95
96  //モバイルボタンが固定じゃない場合
97  if ( cocoon_localize_script_options.is_fixed_mobile_buttons_enable != 1 ) {
98    //ヘッダーモバイルメニュー
99    var headerMenu = $( '.mobile-header-menu-buttons' );
100    var headerHight = headerMenu.outerHeight();
101    var headerStartPos = 0;
102    $( window ).scroll( function () {
103      var headerCurrentPos = $( this ).scrollTop();
104      // 画面幅が600px以下の場合は、--wp-admin--admin-bar--heightを考慮しない（WordPressアドミンバーが固定とならないため、ヘッダーメニューの位置を0にする）
105      if ( window.innerWidth <= 600 ) {
106        if ( headerCurrentPos > headerStartPos ) {
107          if ( headerCurrentPos >= 100 ) {
108            headerMenu.css( 'top', '-' + headerHight + 'px' );
109          }
110        } else {
111          headerMenu.css( 'top', 0 );
112        }
113      } else {
114        // CSS変数--wp-admin--admin-bar--heightの値を取得
115        var adminBarHeight =
116          getComputedStyle( document.documentElement )
117            .getPropertyValue( '--wp-admin--admin-bar--height' )
118            .trim() || '0px';
119        if ( headerCurrentPos > headerStartPos ) {
120          if ( headerCurrentPos >= 100 ) {
121            // 管理バーの高さを考慮してtopを設定
122            headerMenu.css(
123              'top',
124              'calc(' + adminBarHeight + ' - ' + headerHight + 'px)'
125            );
126          }
127        } else {
128          // 管理バーの高さを考慮してtopを設定

129          headerMenu.css( 'top', 'calc(' + adminBarHeight + ')' );
130        }
131      }
132      headerStartPos = headerCurrentPos;
133    } );
134
135    //フッターモバイルメニュー
136    var footerMenu = $( '.mobile-footer-menu-buttons' );
137    var footerHeight = footerMenu.outerHeight();
138    var footerStartPos = 0;
139    $( window ).scroll( function () {
140      var footerCurrentPos = $( this ).scrollTop();
141
142      if ( footerCurrentPos > footerStartPos ) {
143        if ( footerCurrentPos >= 100 ) {
144          footerMenu.css(
145            'bottom',
146            'calc( -1 * (env(safe-area-inset-bottom) + ' +
147              footerHeight +
148              'px) )'
149          );
150        }
151      } else if ( footerCurrentPos - footerStartPos < -8 ) {
152        footerMenu.css( 'bottom', 0 );
153      }
154
155      footerStartPos = footerCurrentPos;
156    } );
157
158    var headerButtons = $( '.mobile-header-menu-buttons' );
159    var footerButtons = $( '.mobile-footer-menu-buttons' );
160    headerButtons.click( function () {
161      headerButtons.css( 'z-index', '3' );
162      footerButtons.css( 'z-index', '2' );
163    } );
164
165    footerButtons.click( function () {
166      headerButtons.css( 'z-index', '2' );
167      footerButtons.css( 'z-index', '3' );
168    } );
169  }
170
171  //コメントボタンがクリックされたとき
172  const clickEventType = window.ontouchstart !== null ? 'click' : 'touchend';
173  $( document ).on(
174    clickEventType,
175    '#comment-reply-btn, .comment-reply-link',
176    function () {
177      $( '#comment-reply-btn' ).slideUp();
178      const respond = document.getElementById( 'respond' );
179      const styles = {
180        inset: 'auto',
181        position: 'static',
182        visibility: 'visible',
183      };
184      Object.entries( styles ).forEach( ( [ key, value ] ) => {
185        respond.style[ key ] = value;
186      } );
187      $( '#respond' ).slideDown();
188    }
189  );
190
191  //Google検索ボタン
192  $( '.sbtn' ).click( function () {
193    var w = $( this ).prev( '.sform' ).text();
194    if ( w )
195      window.open(
196        'https://www.google.co.jp/search?q=' + encodeURIComponent( w ),
197        '_blank'
198      );
199  } );
200
201  //スライドインサイドバーのアーカイブセレクトボックス選択処理
202  $( '.sidebar-menu-content .widget_archive select' ).change( function () {
203    document.location.href = this.options[ this.selectedIndex ].value;
204  } );
205
206  //スライドインサイドバーのカテゴリーセレクトボックス選択処理
207  $( '.sidebar-menu-content .widget_categories select' ).change( function () {
208    if ( this.options[ this.selectedIndex ].value > 0 ) {
209      this.parentNode.submit();
210    }
211  } );
212
213  function drawerCloser( selecter, checkbox ) {
214    $( selecter ).click( function () {
215      $( checkbox ).prop( 'checked', false );
216      // const href = $(this).attr('href');
217      // if (href.match(/#/)) {
218      //   $(checkbox).prop('checked', false);
219      // }
220    } );
221  }
222
223  //モバイルメニューをクリックしたら閉じる
224  drawerCloser( '.menu-drawer .menu-item a', '#navi-menu-input' );
225
226  //モバイルサイドバーをクリックしたら閉じる
227  drawerCloser( '#slide-in-sidebar a', '#sidebar-menu-input' );
228
229  //モバイルヘッダーメニューのロゴ処理
230  $( '.mobile-menu-buttons' ).each( function () {
231    if ( $( this ).has( '.logo-menu-button' ).length ) {
232      $( this ).addClass( 'has-logo-button' );
233    }
234  } );
235
236  $( window ).on( 'load', function () {
237    $( '#carousel' ).addClass( 'loaded' );
238  } );
239
240  //FAQボックスのアコーディオン化用
241  $( '.is-style-accordion > .faq > .faq-answer' ).hide();
242  $( '.is-style-accordion > .faq > .faq-question' ).click( function () {
243    $( this ).next( '.is-style-accordion .faq-answer' ).slideToggle();
244    $( this ).toggleClass( 'active' );
245  } );
246
247  //モバイルサイドバー表示時にサイドバーを移動する・モバイルサイドバーを閉じる時に元の位置に戻す
248  $( document ).on( 'change', '#sidebar-menu-input', function () {
249    if ( $( this ).prop( 'checked' ) ) {
250      $( '#sidebar' ).appendTo( '#sidebar-menu-content' );
251      $( '#sidebar' ).attr( 'id', 'slide-in-sidebar' );
252      $( '#sidebar' ).addClass( 'slide-in-sidebar' );
253      //モバイルサイドバーのリンクをクリックしたら閉じる
254      drawerCloser( '#slide-in-sidebar a', '#sidebar-menu-input' );
255    } else {
256      $( '#sidebar' ).removeClass( 'slide-in-sidebar' );
257      $( '#slide-in-sidebar' ).attr( 'id', 'sidebar' );
258      $( '#sidebar' ).insertAfter( '#main' );
259    }
260  } );
261
262  //リサイズした時はサイドバーを元に戻す
263  var vw = window.innerWidth;
264  $( window ).resize( function () {
265    if ( vw != window.innerWidth ) {
266      $( '#sidebar-menu-input' ).prop( 'checked', false ).change();
267    }
268    vw = window.innerWidth;
269  } );
270} )( jQuery );
271
272/*
273* Cocoon WordPress Theme incorporates code from "Youtube SpeedLoad" WordPress Plugin, Copyright 2017 Alexufo[http://habrahabr.ru/users/alexufo/]
274"Youtube SpeedLoad" WordPress Plugin is distributed under the terms of the GNU GPL v2
275*/
276( function () {
277  var f = document.querySelectorAll( '.video-click' );
278  for ( var i = 0; i < f.length; ++i ) {
279    f[ i ].onclick = function () {
280      var iframe = this.getAttribute( 'data-iframe' );
281      this.parentElement.innerHTML = '<div class="video">' + iframe + '</div>';
282    };
283  }
284} )();
285
286// ヘッダーの位置オフセットを更新
287( function () {
288  function updateHeaderOffset() {
289    const header = document.getElementById( 'header-container' );
290
291    let offset = 0;
292
293    if ( header && header.classList.contains( 'fixed-header' ) ) {
294      offset = header.offsetHeight;
295    }
296
297    // .mobile-header-menu-buttonsのtopを取得して処理
298    const mobileHeaderMenuButtons = document.querySelector(
299      '.mobile-header-menu-buttons'
300    );
301    if ( mobileHeaderMenuButtons ) {
302      const computedStyle = window.getComputedStyle( mobileHeaderMenuButtons );
303      const topValue = parseFloat( computedStyle.top );
304
305      if ( topValue >= 0 ) {
306        // topが0以上の場合は、その要素の高さを反映
307        offset += mobileHeaderMenuButtons.offsetHeight;
308      } else {
309        // topが0未満の場合は、0pxとして扱う（offsetは変更しない）
310        // 必要に応じて、ここで追加の処理を行う
311      }
312    }
313
314    document.documentElement.style.setProperty(

315      '--cocoon--header-container--position-offset',
316      offset + 'px'
317    );
318  }
319
320  document.addEventListener( 'DOMContentLoaded', updateHeaderOffset );
321
322  // ブラウザサイズ変更時に更新（リサイズ処理が完了してから実行するため、少し遅延させる）
323  let resizeTimer;
324  window.addEventListener( 'resize', function () {
325    clearTimeout( resizeTimer );
326    resizeTimer = setTimeout( function () {
327      updateHeaderOffset();
328    }, 100 );
329  } );
330
331  // スクロール時にも更新（.mobile-header-menu-buttonsのtopが変更される可能性があるため）
332  window.addEventListener( 'scroll', updateHeaderOffset );
333} )();
334