https://w-clinic.shop/view/asset/user-3-1-2-8bf4803e9a036fa582129f0462ddd6d9.js

1$(function () {
2    const pcBreakPoint = 1000;
3
4    // ハンバーガー開閉
5    $('#js-hamburger-btn').on('click', function () {
6        $('#header-menu').stop(true, true).fadeToggle();
7        $('body').toggleClass('open');
8    });
9
10    $('#hamburger-close').on('click', function () {
11        $('#header-menu').stop(true, true).fadeOut();
12        $('body').removeClass('open');
13    });
14
15    // カテゴリメニュー（スマホのみ）
16    $('#header-nav-category .has-sub-category').on('click', function (e) {
17        if ($(window).width() < pcBreakPoint) {
18            e.preventDefault();
19            $(this).next().stop(true, true).slideToggle();
20            $(this).toggleClass('open');
21        }
22    });
23
24    // 会員メニュー
25    $('#header-member').on('click', function () {
26        $('#header-member-list').stop(true, true).slideToggle();
27        $(this).toggleClass('open');
28    });
29
30    // 検索 Enter でリンククリック
31    $('#header-search').on('keypress', function (e) {
32        if (e.which === 13) {
33            $('#header-search-link')[0].click();
34        }
35    });
36    //Enterキーで検索実行
37    $('.item-search-set input[type="text"]').on('keypress', function (e) {
38      var $parent = $(this).closest('.item-search-set');
39      if (e.keyCode == 13 && $parent.find('.button').length > 0) {
40        $parent.find('.button')[0].click();
41      }
42    });
43
44    // カレンダー特定日
45    $('.day-list').each(function () {

46        const month = $(this).data('month');
47        const day = $(this).data('day');
48        const color = $(this).data('color');
49
50        $(`.makeshop-calendar${month} .day${day}`).css({
51            backgroundColor: color,
52            color: '#fff',
53            fontWeight: 'bold'
54        });
55    });
56
57    // サイドナビとメイン高さ調整
58    if ($('#side-nav').is(':visible')) {
59        const sideNavHeight = $('#side-nav').height();
60        $('main').css('min-height', $('main').height() < sideNavHeight ? sideNavHeight : 0);
61    } else {
62        $('main').css('min-height', 0);
63    }
64
65    // アコーディオン共通処理
66    function initAccordion(triggerSelector, itemSelector, opts) {
67        const options = $.extend({ onlyBelow: null }, opts);
68        $(document).on('click', triggerSelector, function (e) {
69            if (options.onlyBelow && $(window).width() >= options.onlyBelow) {
70                return; // PC幅ではリンクとして動作
71            }
72            e.preventDefault();
73            const $item = $(this).closest(itemSelector);
74            const $submenu = $item.children('ul');
75            $item.toggleClass('open');
76            $submenu.stop(true, true).slideToggle(200);
77        });
78    }
79
80    // --- 大カテゴリ（タイトル → カテゴリ） ---
81    $('.header-nav-title').on('click', function (e) {
82        e.preventDefault();
83        const $title = $(this);
84        const $category = $title.next('.header-nav-category');
85        const willClose = $category.is(':visible');
86
87        $title.toggleClass('open');
88        $category.stop(true, true).slideToggle(200);
89
90        // 閉じるときは中のサブアコーディオンを全部閉じる
91        if (willClose) {
92            $category.find('.header-nav-sub-accordion-item.open')
93                .removeClass('open')
94                .children('ul').stop(true, true).slideUp(0);
95        }
96    });
97
98    // サイドナビのサブメニュー
99    initAccordion('.side-nav-sub-ttl', '.side-nav-sub-accordion-item');
100
101    // ヘッダーのサブメニュー（モバイルのみ開閉）
102    initAccordion('.header-nav-sub-ttl', '.header-nav-sub-accordion-item', { onlyBelow: pcBreakPoint });
103});
104//.search-overlay-menu
105$(function () {
106  $('.search-overlay-menu-trigger').on('click', function () {
107    if ($('html').hasClass('open')) {
108      sideMenuMotion();
109    }
110    $('#search-overlay-menu').fadeToggle('400');
111    $('html').toggleClass('no-scroll');
112    $('#search-keyword').focus();
113    $('#search-keyword').val("");
114  });
115});
116
117$(function () {
118    // スムーススクロール（固定100pxオフセット）
119    $('a[href*="#"]').on('click', function (e) {
120        const targetId = $(this).attr('href').split('#')[1];
121        if (!targetId) return; // #のみの場合は無視
122
123        const $target = $('#' + targetId);
124        if ($target.length) {
125            e.preventDefault();
126
127            // 固定オフセット
128            const headerOffset = 100;
129
130            // スクロール位置
131            const position = $target.offset().top - headerOffset;
132
133            $('html, body').animate({ scrollTop: position }, 500, 'swing');
134        }
135    });
136});
137
138
139//指定日時バナー表示／非表示
140$(document).ready(function() {
141  $(".view_timer").each(function(index, target) {
142    var startDate = $(this).attr("data-start-date");
143    var endDate = $(this).attr("data-end-date");
144    var nowDate = new Date();
145
146    if (startDate) {
147      startDate = new Date(startDate);
148    } else {
149      startDate = nowDate;
150    }
151    if (endDate) {
152      endDate = new Date(endDate);
153    }
154
155    if (startDate <= nowDate && (!endDate || nowDate <= endDate)) {
156      $(this).show();
157    } else {
158      $(this).hide();
159    }
160  });
161});
162
163
164
165
166
167
168
169
170
171
172
173
174
175$(function () {
176    $('#toggle-brand-list').on('click', function () {
177      const $hiddenView = $('.hidden-view');
178      const $button = $(this);
179      const isVisible = $hiddenView.is(':visible');
180
181      $hiddenView.slideToggle(300);
182
183      // クラスとボタンテキストを切り替え
184      if (isVisible) {
185        $button.removeClass('open').text('全てのブランドを見る');
186      } else {
187        $button.addClass('open').text('閉じる');
188      }
189    });

190  });
191 $(function () {
192
193$(".feature-main-img").each(function (i) {
194    $(this).find(".feature-img").attr("data-slider", i);
195    $(this).find(".feature-thumbnail").attr("data-slider", i);
196});
197
198// メインスライダー（矢印なし・サムネイル連動）
199$('.feature-img').each(function () {
200    const attr = $(this).attr('data-slider')
201    const $thumbnail = $('.feature-thumbnail[data-slider="' + attr + '"]');
202    const slider = $(this).bxSlider({
203        auto: true,
204        // pagerCustom: '.feature-thumbnail[data-slider="' + attr + '"]',
205        controls: false, // ← 矢印なしに設定
206        mode: 'fade',
207        adaptiveHeight: true,
208        onSlideAfter: function ($el, oldIndex, newIndex) {
209            // メインが変わったらサムネイルのアクティブ状態を同期
210            $thumbnail.find('li').removeClass('active').eq(newIndex).addClass('active');
211        }
212    });
213    // サムネイルクリック → メインスライダーを移動
214    $thumbnail.on('click', 'li', function (e) {
215      e.preventDefault();
216        const index = $(this).data('index');
217        slider.stopAuto();
218        slider.goToSlide(index);
219        slider.startAuto();
220        $thumbnail.find('li').removeClass('active');
221        $(this).addClass('active');
222    });
223
224    // 初期アクティブ
225    $thumbnail.find('li').first().addClass('active');
226});
227
228// サムネイルスライダー（4枚表示、矢印あり）
229$('.feature-thumbnail').each(function () {
230    $(this).find('li').each(function (i) {
231      $(this).attr('data-index', i);
232    });
233    $(this).bxSlider({
234        minSlides: 4,
235        maxSlides: 4,
236        slideWidth: 270, // 必要に応じてサムネイル画像の幅に調整
237        slideMargin: 10,
238        pager: false,
239        controls: true,
240        touchEnabled: false,
241        moveSlides: 1
242    });
243});
244    // 汎用アコーディオン処理
245    $('.js-accordion-trigger').on('click', function () {
246      const $title = $(this);
247      const $body = $title.next('.accordion-body');
248
249      $title.toggleClass('is-open');
250      $body.stop().slideToggle(300);
251    });
252
253    // 閉じるボタンで閉じる
254    $('.accordion-close-btn').on('click', function () {
255      const $body = $(this).closest('.accordion-body');
256      const $title = $body.prev('.js-accordion-trigger');
257
258      $body.stop().slideUp(300);
259      $title.removeClass('is-open');
260    });
261  });
262
263$(function() {
264  // data-rank付与の共通関数
265  function addDataRank($container) {
266    $container.children('li').each(function(i) {
267      $(this).find('.contents-item-img').attr('data-rank', i + 1);
268    });
269  }
270
271  // スライダー初期化の共通関数
272  function initSlider($slider) {
273    addDataRank($slider);
274
275    const $slides = $slider.children('li');
276
277    // 複製スライドにdata-rankコピー
278    function copyRankToClones() {
279      $slider.closest('.bx-wrapper').find('.bx-clone').each(function() {
280        const cloneIndex = $(this).data('slideIndex');
281        if (typeof cloneIndex === 'number') {
282          const rank = $slides.eq(cloneIndex).find('.contents-item-img').attr('data-rank');
283          $(this).find('.contents-item-img').attr('data-rank', rank);
284        }
285      });
286    }
287
288    return $slider.bxSlider({
289      slideWidth: 150,
290      slideMargin: 10,
291      minSlides: 3,
292      maxSlides: 3,
293      moveSlides: 1,
294      pager: false,
295      controls: false,
296      infiniteLoop: true,
297      auto: true,
298      pause: 4000,
299      autoHover: true,
300      shrinkItems: true,  // ← コンテナに合わせてスライドを縮小
301      onSliderLoad: function() {
302        // copyRankToClones();
303        // // bx-wrapper max-widthを強制100%
304        $slider.closest('.bx-wrapper').css('max-width', '100%');
305      },
306      // onSlideAfter: copyRankToClones,
307    });
308  }
309
310  let rankingSliderInstance = null;
311  let commonSliderInstance = null;
312
313  function checkAndInitSliders() {
314    const w = $(window).width();
315
316    if (w <= 1240) {
317      // スライダー未初期化なら初期化
318      if (!rankingSliderInstance) {
319        rankingSliderInstance = initSlider($('.contents-ranking-item-list'));

320      }
321      if (!commonSliderInstance) {
322        commonSliderInstance = initSlider($('.common-slider ul'));
323      }
324    } else {
325      // スライダー破棄
326      if (rankingSliderInstance) {
327        rankingSliderInstance.destroySlider();
328        rankingSliderInstance = null;
329      }
330      if (commonSliderInstance) {
331        commonSliderInstance.destroySlider();
332        commonSliderInstance = null;
333      }
334
335      // data-rankは残す
336      addDataRank($('.contents-ranking-item-list'));
337      addDataRank($('.common-slider ul'));
338
339      // ulのstyleはリセット
340      $('.contents-ranking-item-list, .common-slider ul').removeAttr('style');
341
342      // bx-wrapper max-widthリセット
343      $('.bx-wrapper').css('max-width', '100%');
344    }
345  }
346
347  // 初回チェック
348  checkAndInitSliders();
349
350  // リサイズ時もチェック
351  $(window).on('resize', function() {
352    checkAndInitSliders();
353  });
354});
355
356
357
358
359
360
361
362
363
364
365
366// ポップアップバナー
367document.addEventListener('DOMContentLoaded', function() {
368    var footerBanner = document.createElement('div');
369    footerBanner.id = 'footer-banner';
370    footerBanner.innerHTML = `<div id="banner-content"><a href="https://w-clinic.shop/shop/idinfo.html">
371<img src="https://gigaplus.makeshop.jp/wclinic/shop/tempbanner-min2.png" alt="" width="250"></a><span id="close-button">X</span></div>`;
372
373
374    var css = `
375        #footer-banner {
376            position: fixed;
377            bottom: 0;
378            right: 0;
379            /*width: 100%;*/
380            /*z-index: 1000;*/
381            text-align: right;
382        }
383        #banner-content {
384            position: relative;
385            display: inline-block;
386        }
387        #close-button {
388            position: absolute;
389            top: -15px;
390            right: 0;
391            cursor: pointer;
392            font-size: 20px;
393            color: #000;
394            padding: 2px 6px;
395        }
396    `;
397
398    var style = document.createElement('style');
399    style.type = 'text/css';
400    style.appendChild(document.createTextNode(css));
401
402    document.head.appendChild(style);
403    document.body.appendChild(footerBanner);
404    document.getElementById('close-button').addEventListener('click', function() {
405        footerBanner.style.display = 'none';
406    });
407});