https://www.kasamart.jp/wp/wp-content/themes/kasamart/js/common2020.js

1//ユーザエージェント条件分岐
2var _ua = (function (u) {
3  return {
4    Tablet: (u.indexOf("windows") !== -1 && u.indexOf("touch") !== -1) || u.indexOf("ipad") !== -1 || (u.indexOf("android") !== -1 && u.indexOf("mobile") === -1) || (u.indexOf("firefox") !== -1 && u.indexOf("tablet") !== -1) || u.indexOf("kindle") !== -1 || u.indexOf("silk") !== -1,
5    Mobile: (u.indexOf("windows") !== -1 && u.indexOf("phone") !== -1) || u.indexOf("iphone") !== -1 || u.indexOf("ipod") !== -1 || (u.indexOf("android") !== -1 && u.indexOf("mobile") !== -1) || (u.indexOf("firefox") !== -1 && u.indexOf("mobile") !== -1) || u.indexOf("blackberry") !== -1
6  };
7})(window.navigator.userAgent.toLowerCase());
8
9//spの時はviewportを追加
10if (_ua.Mobile) {
11  var meta_vp = document.createElement("meta");
12  meta_vp.setAttribute("name", "viewport");
13  meta_vp.setAttribute("content", "width=device-width, initial-scale=1.0");
14  document.getElementsByTagName("head")[0].appendChild(meta_vp);
15}
16
17//spのブレイクポイント
18const break_sp = 812;
19
20$(function () {
21  /*------------------------------------------------------------
22	変数
23	------------------------------------------------------------*/
24  var header = $("#header2020");
25
26  /*------------------------------------------------------------
27	固定グローバルヘッダーだった場合のスムーススクロール用オフセット値設定
28	------------------------------------------------------------*/
29  var scroll_offset = 0;
30  var pc_header_height = 120;
31  var sp_header_height = 70;
32
33  $(window).on({
34    "load resize": function () {
35      $(this).width() > break_sp ? (scroll_offset = pc_header_height) : (scroll_offset = sp_header_height);
36    }
37  });
38
39  /*------------------------------------------------------------
40	スムーススクロール：#だけなら処理せず、.modalクラスも除く
41	------------------------------------------------------------*/
42  $('a[href^="#"]')
43    .not(".modal")
44    .on("click", function () {
45      var href = $(this).attr("href");
46      if (href !== "#") {
47        $("html, body")
48          .stop()
49          .animate(
50            {
51              scrollTop: $(href === "#top" ? "html" : href).offset().top - scroll_offset
52            },
53            500
54          );
55        return false;
56      }
57    });
58
59  //アンカーリンクでジャンプしてきた時、固定グローバルヘッダー分ずれるのを防ぐ
60  $(window).on("load", function () {
61    var url = $(location).attr("href");
62    if (url.indexOf("#") !== -1) {
63      var anchor = url.split("#");
64      var target = $("#" + anchor[anchor.length - 1]);
65      if (target.length) {
66        var pos = Math.floor(target.offset().top) - scroll_offset;
67        $("html, body").animate({ scrollTop: pos }, 0);
68      }
69    }
70  });
71
72  /*------------------------------------------------------------
73	タブレットの時にはみ出す要素があると隙間ができるのでその分をカットする
74	------------------------------------------------------------*/
75  if (_ua.Tablet) $("#wrapper").css({ overflow: "hidden" });
76
77  /*------------------------------------------------------------
78	ページトップへ戻るボタン
79	------------------------------------------------------------*/
80  var goto_pagetop = $(".goto_pagetop");
81  $(window).on({
82    "load scroll": function () {
83      if ($(this).scrollTop() > 100) {
84        goto_pagetop.fadeIn();
85      } else {
86        goto_pagetop.fadeOut();
87      }
88    }
89  });
90
91  /*------------------------------------------------------------
92	PC追従メニュー
93	------------------------------------------------------------*/
94  // var target_pc_menu = header.find(".pc").find(".nav_product");
95  // var target_pc_point = target_pc_menu.offset().top;
96  // var target_pc_offset = target_pc_menu.outerHeight();
97  // $(window).on({
98  // 	"load scroll": function(){
99  // 		if($(this).scrollTop() > target_pc_point){
100  // 			target_pc_menu.addClass("fixed");
101  // 			target_pc_menu.prev().attr({style:"margin-bottom:" + target_pc_offset + "px"});
102  // 		}else{
103  // 			target_pc_menu.removeClass("fixed");
104  // 			target_pc_menu.prev().removeAttr("style");
105  // 		}
106  // 	}
107  // });
108
109  var target_pc_menu = header.find(".pc").find(".menu_fix_pc");
110  var target_pc_point = target_pc_menu.offset().top;
111  var target_pc_offset = target_pc_menu.outerHeight();
112  $(window).on({
113    "load scroll": function () {
114      if ($(this).scrollTop() > target_pc_point) {
115        target_pc_menu.addClass("fixed");
116        target_pc_menu.prev().attr({ style: "margin-bottom:" + target_pc_offset + "px" });
117      } else {
118        target_pc_menu.removeClass("fixed");
119        target_pc_menu.prev().removeAttr("style");
120      }
121    }
122  });
123
124  /*------------------------------------------------------------
125	pc商品メニュー
126	------------------------------------------------------------*/
127  header
128    .find(".nav_product")
129    .children("ul")
130    .children("li")
131    .on({
132      mouseover: function () {
133        //子カテゴリーがある場合だけ処理
134        if ($(this).find(".inner").find("a")[0]) {
135          $(this).children("div").stop(true).slideDown();
136        }
137      },
138      mouseout: function () {
139        if ($(this).find(".inner").find("a")[0]) {

140          $(this).children("div").stop(true).slideUp();
141        }
142      }
143    });
144
145  /*------------------------------------------------------------
146	spメニュー
147	------------------------------------------------------------*/
148  header.find(".bt_sp_menu").on({
149    click: function () {
150      if ($(this).hasClass("on")) {
151        $(this).removeClass("on").siblings(".sp_main_menu").stop(true).slideUp();
152        $("body").removeClass("on");
153      } else {
154        $(this).addClass("on").siblings(".sp_main_menu").stop(true).slideDown();
155        $("body").addClass("on");
156      }
157    }
158  });
159
160  /*------------------------------------------------------------
161	関連商品の値段高さ揃え
162	------------------------------------------------------------*/
163  var product_list = $(".product_list");
164  if (product_list[0]) {
165    if ($(window).width() > break_sp) {
166      product_list.children("ul").each(function () {
167        var li_length = $(this).find("li").length; //ulごとに各々の数を変更
168        if ($("#category_list")[0]) li_length = 4; //タクソノミーページのカテゴリーリストだけは4つづつで処理
169        $(this).find("li").find("h3").tile(li_length);
170      });
171    } else {
172      product_list.each(function () {
173        $(this).children("ul").children("li").find("h3").tile(2);
174      });
175    }
176  }
177});
178
179//LightBox - Interview
180$(".modal-link").each(function () {
181  $(".link-inter", this).on("click", function () {
182    var contents = $(this).next().html();
183    $("body").css({ overflow: "hidden" }).addClass("visible");
184    $(".lightBox").fadeIn(500);
185    $(".lightBox").addClass("style");
186    $(".lightBox .contents").html(contents);
187  });
188});
189
190$(".lightBox__close, .lightBox__inner, .lightBox__overlay").click(function () {
191  $("body").css({ overflow: "inherit" }).removeClass("visible");
192  $(".lightBox").hide();
193  $(".lightBox .contents").html("");
194  $(".lightBox").removeClass("style");
195});
196
197jQuery(document).ready(function () {
198  $(".btn_register").on("click", function () {
199    $(this).toggleClass("is-active");
200    if ($(this).hasClass("is-active")) {
201      $(".member_header").addClass("member_header_login");
202      $(".sp_head").addClass("member_header_login");
203    } else {
204      $(".member_header").removeClass("member_header_login");
205      $(".btn_register").removeClass("is-active");
206      $(".sp_head").removeClass("member_header_login");
207    }
208  });
209  $(".btn_logout").click(function () {
210    $(".member_header").removeClass("member_header_login");
211    $(".btn_register").removeClass("is-active");
212    $(".sp_head").removeClass("member_header_login");
213  });
214});
215
216//faq toggle stuff
217// $('.subsection .flow-p').click(function(e) {
218// e.preventDefault();
219// var notthis = $('.active').not(this);
220// notthis.toggleClass('active').next('.faqanswer').toggle();
221//  $(this).toggleClass('active').next().toggle("fast");
222// });
223
224(function (window, $) {
225  $(document).ready(function () {
226    $("faqanswer").hide();
227
228    $(".subsection .flow-p").click(function () {
229      var toggle = $(this).nextUntil(".subsection .flow-p");
230      $(this).toggleClass("active");
231      toggle.slideToggle();
232
233      // Allow only one Q open at a time
234      //$('dd').not(toggle).slideUp();
235      //$('dt').not($(this)).removeClass('expanded');
236    });
237  });
238})(this, jQuery);
239
240// Khi nhấp vào .link-inter1, hiển thị modal
241$(".modal-link1").each(function () {
242  $(".link-inter1", this).on("click", function () {
243    var contents = $(this).next().html();
244    $("body").css({ overflow: "hidden" }).addClass("visible");
245    $(".lightBox1").fadeIn(500);
246    $(".lightBox1").addClass("style");
247    $(".lightBox1 .contents1").html(contents);
248  });
249});
250
251// Đóng modal
252$(".lightBox__close1, .lightBox__inner1, .lightBox__overlay1").click(function () {
253  $("body").css({ overflow: "inherit" }).removeClass("visible");
254  $(".lightBox1").hide();
255  $(".lightBox1 .contents1").html("");
256  $(".lightBox1").removeClass("style");
257});
258
259document.querySelectorAll(".p-thema-faq-item").forEach((item) => {
260  const title = item.querySelector(".p-thema-faq-item-title");

261  const content = item.querySelector('[itemprop="acceptedAnswer"]');
262
263  if (!title || !content) return; // tránh lỗi
264
265  title.addEventListener("click", () => {
266    const isOpen = item.classList.contains("active");
267
268    document.querySelectorAll(".p-thema-faq-item").forEach((el) => {
269      el.classList.remove("active");
270      el.querySelector(".p-thema-faq-item-title")?.classList.remove("active");
271      const c = el.querySelector('[itemprop="acceptedAnswer"]');
272      if (c) c.style.maxHeight = null;
273    });
274
275    if (!isOpen) {
276      item.classList.add("active");
277      title.classList.add("active");
278      content.style.maxHeight = content.scrollHeight + "px";
279    }
280  });
281});