https://moshicom.com/assets/js/top2026.js

1// top page only js
2
3// カテゴリースライダー/2026
4new Swiper('.categorieSlide', {
5  slidesPerView: 'auto',
6  freeMode: true,
7
8  watchOverflow: true,
9  observer: true,
10  observeParents: true,
11  watchSlidesProgress: true,
12
13  breakpoints: {
14    0: {
15      spaceBetween: 20,
16      slidesOffsetBefore: 0,
17      slidesOffsetAfter: 0,
18    },
19
20    768: {
21      spaceBetween: 20,
22      slidesOffsetBefore: 20,
23      slidesOffsetAfter: 20,
24    },
25    
26    1025: {
27      spaceBetween: 0,
28      slidesOffsetBefore: 42,
29      slidesOffsetAfter: 42,
30    },
31  },
32});
33
34new Swiper('.bannerSlide', {
35  autoplay: {
36    delay: 4000,
37  },
38
39  slidesPerView: 'auto',
40
41  loop: true,
42  loopAdditionalSlides: 3,
43
44  centeredSlides: true,
45  centeredSlidesBounds: false,
46
47  watchOverflow: true,
48
49  breakpoints: {
50    0: {
51      spaceBetween: window.innerWidth * 0.03, // 3vw
52    },
53    768: {
54      spaceBetween: 15,
55    },
56    1024: {
57      spaceBetween: 20,
58    },
59  },
60});
61
62// フル幅スライダー/2026
63document.querySelectorAll('.slide-full-three, .slide-full-four').forEach((el) => {
64  const isThree = el.classList.contains('slide-full-three');
65  const slidesPC = isThree ? 3 : 4;
66
67  new Swiper(el.querySelector('.swiper-container'), {
68    navigation: {
69      nextEl: el.querySelector('.swiper-button-next'),
70      prevEl: el.querySelector('.swiper-button-prev'),
71    },
72
73    breakpoints: {
74      0: {
75        spaceBetween: 10,
76        slidesPerView: 1.4,
77      },
78
79      768: {
80        spaceBetween: 10,
81        slidesPerView: slidesPC,
82      },
83
84      1025: {
85        spaceBetween: 15,
86        slidesPerView: slidesPC,
87      },
88    },
89  });
90});
91
92// user-scalable=no
93var ua = navigator.userAgent.toLowerCase();
94var isiOS = (ua.indexOf('iphone') > -1) || (ua.indexOf('ipad') > -1);
95if (isiOS) {
96  var viewport = document.querySelector('meta[name="viewport"]');
97  if (viewport) {
98    var viewportContent = viewport.getAttribute('content');
99    viewport.setAttribute('content', viewportContent + ', user-scalable=no');
100  }
101}
102
103// 通知用
104// タグの存在を確認
105if (0 < $("div.noty-message").length) {
106  var time = $(".noty-message").data("time");
107  var body_message = $(".noty-message").data("message");
108  var alert_type = $(".noty-message").data("type");
109
110  if (parseInt(msg_timestamp) - parseInt(time) < 3000) {
111    // 通知設定
112    noty({
113      text: body_message,
114      type: alert_type,
115      theme: 'relax',
116      timeout: 3000
117    });
118  }
119}
120
121// header collapse sp
122$('.btn-link-close').click(function () {
123  $('.collapse').collapse('hide');
124});
125
126// a click
127$('a[href^="#"]' +
128  'a:not([data-toggle="modal"])' +
129  'a:not([data-toggle="collapse"])' +
130  'a:not([data-toggle="tab"])' +
131  'a:not([data-toggle="dropdown"])' +
132  'a:not([data-toggle="pill"])' +
133  'a:not([data-toggle="tooltip"])' +
134  'a:not([data-slide="prev"])' +
135  'a:not([data-slide="next"])').click(function () {
136    var speed = 500;
137    var href = $(this).attr("href");
138    var target = $(href == "#" || href == "" ? 'html' : href);
139    var position = target.offset().top;
140    $('body,html').animate({ scrollTop: position }, speed, 'swing');
141    return false;
142  });
143// dropdown stop
144$('.dropdown-menu').on({
145  "click": function (e) {
146    e.stopPropagation();
147  }
148});
149
150// dropdown / form text color
151$('.dropdown-close').click(function () {
152  $('.dropdown-menu.show').removeClass('show');
153  $('.icon-arrow-arb.show').removeClass('show');
154  $('.form-text[aria-expanded="true"]').addClass('text-dark');
155});
156$('.form-text[aria-expanded="false"]').click(function () {
157  $('.form-text').removeClass('text-dark');
158});
159$('.list-group-item').click(function () {
160  $('.show[aria-labelledby="dropdownKeyword"]').removeClass('show');
161  $('.form-control[aria-expanded="true"]').addClass('text-dark');
162});
163$('.form-control[aria-expanded="false"]').click(function () {
164  $('.form-control').removeClass('text-dark');
165});
166
167// rel noopener
168var aEList = document.querySelectorAll('a');
169for (var i = 0; i < aEList.length; i++) {
170  var element = aEList[i];
171  if (element.hasAttribute('target') && element.getAttribute('target') === '_blank') {
172    element.setAttribute('rel', 'noopener');
173  }
174}
175
176// slide-two lines34
177$('.slide-two').find('.lines34').each(function (index, value) {
178  if (window.matchMedia('(min-width: 768px)').matches) {
179    $(this).addClass('lines4');
180    $(this).removeClass('lines34');
181  } else {
182    $(this).addClass('lines3');
183    $(this).removeClass('lines34');
184  }
185});
186// slide-two lines21
187$('.slide-two').find('.lines21').each(function (index, value) {
188  if (window.matchMedia('(min-width: 768px)').matches) {
189    $(this).addClass('lines2');
190    $(this).removeClass('lines21');
191  } else {
192    $(this).addClass('lines1');
193    $(this).removeClass('lines21');
194  }
195});
196// news-list lines12
197$('.news-list').find('.lines12').each(function (index, value) {
198  if (window.matchMedia('(min-width: 768px)').matches) {
199    $(this).attr('class', 'lines1');
200  } else {
201    $(this).attr('class', 'lines2');
202  }
203});
204
205//news-list swiper
206var newslist_swiper = new Swiper('.news-list .swiper-container', {
207  slidesPerView: 1,
208  spaceBetween: 20,
209  navigation: {
210    nextEl: '.news-list .swiper-button-next',
211    prevEl: '.news-list .swiper-button-prev',
212  },
213});
214
215// trunk8

216$('.lines1').trunk8({
217  lines: 1
218});
219$('.lines2').trunk8({
220  lines: 2
221});
222$('.lines3').trunk8({
223  lines: 3
224});
225$('.lines4').trunk8({
226  lines: 4
227});
228
229// イベント主催者の方へスライダー/2026
230(function () {
231  function fillSlides(wrapperEl, rotate) {
232    var tpl = document.getElementById("gallerySlides");
233    if (!tpl || !wrapperEl) return;
234
235    var frag = tpl.content.cloneNode(true);
236    var nodeList = frag.querySelectorAll(".swiper-slide");
237    var slides = Array.prototype.slice.call(nodeList);
238
239    if (!slides.length) return;
240
241    var r = rotate || 0;
242    r = ((r % slides.length) + slides.length) % slides.length;
243
244    if (r > 0) {
245      var head = slides.splice(0, r);
246      slides = slides.concat(head);
247    }
248
249    wrapperEl.innerHTML = "";
250    for (var i = 0; i < slides.length; i++) {
251      wrapperEl.appendChild(slides[i]);
252    }
253  }
254
255  function setupDom() {
256    fillSlides(document.querySelector(".lane--left .swiper-wrapper"), 0);
257    fillSlides(document.querySelector(".lane--right .swiper-wrapper"), 3);
258    fillSlides(document.querySelector(".lane-sp .swiper-wrapper"), 1);
259  }
260
261  var laneLeft = null;
262  var laneRight = null;
263  var laneSp = null;
264
265  var mqSp = window.matchMedia("(max-width: 767.98px)");
266  var currentMode = null;
267  var resizeTimer = null;
268
269  function prefersReducedMotion() {
270    return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
271  }
272
273  function destroyAll() {
274    if (laneLeft) {
275      try { laneLeft.autoplay && laneLeft.autoplay.stop(); } catch (e) { }
276      laneLeft.destroy(true, true);
277      laneLeft = null;
278    }
279    if (laneRight) {
280      try { laneRight.autoplay && laneRight.autoplay.stop(); } catch (e) { }
281      laneRight.destroy(true, true);
282      laneRight = null;
283    }
284    if (laneSp) {
285      try { laneSp.autoplay && laneSp.autoplay.stop(); } catch (e) { }
286      laneSp.destroy(true, true);
287      laneSp = null;
288    }
289  }
290
291  function safeResizeUpdate(sw) {
292    if (!sw) return;
293
294    if (sw.autoplay && sw.autoplay.running) sw.autoplay.stop();
295
296    sw.updateSize();
297    sw.updateSlides();
298    sw.updateProgress();
299    sw.updateSlidesClasses();
300
301    if (sw.params && sw.params.loop) {
302      sw.loopFix();
303    }
304
305    sw.slideTo(sw.activeIndex, 0, false);
306
307    if (sw.autoplay) sw.autoplay.start();
308  }
309
310  function initDesktop() {
311    laneLeft = new Swiper(".lane--left", {
312      direction: "vertical",
313      slidesPerView: "auto",
314      spaceBetween: 12,
315      loop: true,
316      loopAdditionalSlides: 12,
317      speed: 8000,
318      allowTouchMove: false,
319      freeMode: true,
320      freeModeMomentum: false,
321      autoplay: {
322        delay: 1,
323        disableOnInteraction: false
324      }
325    });
326
327    laneRight = new Swiper(".lane--right", {
328      direction: "vertical",
329      slidesPerView: "auto",
330      spaceBetween: 12,
331      loop: true,
332      loopAdditionalSlides: 12,
333      speed: 8000,
334      allowTouchMove: false,
335      freeMode: true,
336      freeModeMomentum: false,
337      autoplay: {
338        delay: 1,
339        disableOnInteraction: false,
340        reverseDirection: true
341      }
342    });
343  }
344
345  function initMobile() {
346    laneSp = new Swiper(".lane-sp", {
347      direction: "horizontal",
348      slidesPerView: 2.4,
349      spaceBetween: 10,
350      centeredSlides: true,
351
352      loop: true,
353      loopAdditionalSlides: 12,
354
355      allowTouchMove: false,
356
357      freeMode: false,
358
359      speed: 450,
360      autoplay: {
361        delay: 3500,
362      },
363    });
364  }
365
366  function updateCurrentSwipers() {
367    safeResizeUpdate(laneLeft);
368    safeResizeUpdate(laneRight);
369    safeResizeUpdate(laneSp);
370  }
371
372  function applyMode(nextMode) {
373    if (prefersReducedMotion()) return;
374
375    if (currentMode === nextMode) {
376      updateCurrentSwipers();
377      return;
378    }
379
380    currentMode = nextMode;
381
382    destroyAll();
383    setupDom();
384
385    if (nextMode === "mobile") initMobile();
386    else initDesktop();
387  }
388
389  function onResize() {
390    if (resizeTimer) window.clearTimeout(resizeTimer);
391    resizeTimer = window.setTimeout(function () {
392      applyMode(mqSp.matches ? "mobile" : "desktop");
393    }, 150);
394  }
395
396  document.addEventListener("DOMContentLoaded", function () {
397    applyMode(mqSp.matches ? "mobile" : "desktop");
398  });
399
400  if (mqSp.addEventListener) {
401    mqSp.addEventListener("change", function () {
402      applyMode(mqSp.matches ? "mobile" : "desktop");
403    });
404  } else if (mqSp.addListener) {
405    mqSp.addListener(function () {
406      applyMode(mqSp.matches ? "mobile" : "desktop");
407    });
408  }
409
410  window.addEventListener("resize", onResize);
411})();
412
413
414// 検索Dropdownの右はみ出し禁止/2026
415(function ($) {
416  if (!$) return;
417
418  var MARGIN = 20;
419
420  function adjust(menu) {
421    if (!menu) return;
422
423    menu.style.marginLeft = '0px';
424
425    var rect = menu.getBoundingClientRect();
426    var vw = window.innerWidth;
427
428    var overflowRight = rect.right - (vw - MARGIN);
429    if (overflowRight > 0) {
430      menu.style.marginLeft = (-overflowRight) + 'px';
431    }
432  }
433
434  function adjustAfterOpen($dropdown) {
435    var menu = $dropdown.find('.dropdown-menu')[0];
436    if (!menu) return;
437
438    requestAnimationFrame(function () { adjust(menu); });
439    setTimeout(function () { adjust(menu); }, 0);
440    setTimeout(function () { adjust(menu); }, 30);
441    setTimeout(function () { adjust(menu); }, 100);
442  }
443
444  $(document).on('shown.bs.dropdown', '.dropdown', function () {
445    adjustAfterOpen($(this));
446  });
447
448  $(document).on('DOMSubtreeModified', '.dropdown-menu.show', function () {
449    adjust(this);
450  });
451
452  $(window).on('resize', function () {
453    $('.dropdown-menu.show').each(function () {
454      adjust(this);
455    });
456  });
457
458})(window.jQuery);