https://okusuritsuhan.shop/common/js/script.js?1781659406

1$(document).ready(function () {
2
3	var $pageTop = $(".pagetop");
4	var $footer = $("#footer");
5	var lastScrollTop = 0;
6	var spFoot = $('.footer__03');
7    var spFootH = spFoot.innerHeight();
8	var win = $(window).innerWidth(); // ウィンドウ幅を変数に格納
9
10    spFoot.css('bottom', `-${spFootH}px`); // spFootの初期を画面外にする
11
12	$(window).on('resize', function() {
13		win = $(window).innerWidth(); // リサイズ時にウィンドウ幅を更新
14	});
15
16	$(window).scroll(function () {
17		var st = $(this).scrollTop();
18		var winH = $(window).innerHeight();
19		var headerH = $('.header').outerHeight();
20		var footerT = $footer.offset().top;
21		var spFootH = spFoot.innerHeight();
22		var chat = $('#chatplusview');　// チャット
23		var orderBtn = $('.reviewScrollProductBox');　// レビューページの追従注文ボタン
24		var productOrderBtn = $('.product.orderBtn'); // 商品ページの追従注文ボタン
25		var tableContentsSwitch = $('.tableContentsSwitch');　// 検索ページの目次
26		if (st > lastScrollTop) {
27			// 下にスクロール
28			$pageTop.stop(true, true).removeClass("show");
29			if (win <= 750) {
30				chat.hide();
31				if (orderBtn.length) {
32					orderBtn.css('bottom','0');
33				}
34				if (productOrderBtn.length) {
35					productOrderBtn.css('bottom','3vw');
36				}
37				if (tableContentsSwitch.length) {
38					if ($('.page_productData').length) {
39						tableContentsSwitch.css('bottom','22vw'); // 商品詳細ページ
40					} else {
41						tableContentsSwitch.css('bottom','5vw'); // 検索ページ
42					}
43
44					if (st > (footerT - winH)) {
45						tableContentsSwitch.hide()
46					}
47				}
48			} else {
49				chat.show();
50			}
51
52			// 商品ページの追従注文ボタン
53			if (productOrderBtn.length) {
54				let targetContent = $('.pro_detail_wrap_01').offset().top;
55				let targetContentH = $('.pro_detail_wrap_01').outerHeight();
56				let spTargetContentH = $('.info__item.main.show__sp').outerHeight();
57				if (st > (targetContent + targetContentH - headerH - spTargetContentH)) {
58					productOrderBtn.addClass('active');
59                    tableContentsSwitch.css('bottom','22vw');
60					if (st > (footerT - winH)) {
61						productOrderBtn.removeClass('active');
62                        tableContentsSwitch.css('bottom','5vw');
63					}
64				} else {
65					productOrderBtn.removeClass('active');
66                    tableContentsSwitch.css('bottom','5vw');
67				}
68			}
69
70			if (win <= 1120) {
71				if (orderBtn.length) {
72					if (st > (footerT - winH)) {
73						orderBtn.hide()
74					}
75				}
76			}
77
78			spFoot.css('bottom', `-${spFootH}px`);
79			if ($(this).height() + $(this).scrollTop() - ($pageTop.height() * 3) > $footer.offset().top) {
80				$pageTop.stop(true, true).addClass("show");
81				$pageTop.removeClass("fixed");
82			}
83		} else {
84			// 上にスクロール
85			if ($(this).scrollTop() > 100) {
86				$pageTop.stop(true, true).addClass("show");
87			} else {
88				$pageTop.stop(true, true).removeClass("show");
89			}
90			spFoot.css('bottom', '0');
91			if (win <= 750) {
92				if ($(this).height() + $(this).scrollTop() - ($pageTop.height() * 3) <= $footer.offset().top) {
93					$pageTop.addClass("fixed");
94					chat.show();
95				}
96				if (orderBtn.length) {
97					orderBtn.css('bottom','17vw');
98				}
99				if (productOrderBtn.length) {
100					productOrderBtn.css('bottom','20vw');
101				}
102				if (tableContentsSwitch.length) {
103					tableContentsSwitch.show();
104					if ($('.page_productData').length) {
105						tableContentsSwitch.css('bottom','38vw'); // 商品詳細ページ
106					} else {
107						tableContentsSwitch.css('bottom','20vw'); // 検索ページ
108					}
109				}
110			}
111
112			if (win <= 1120) {
113				if (orderBtn.length) {
114					orderBtn.show()
115				}
116			}
117
118			// 商品ページの追従注文ボタン
119			if (productOrderBtn.length) {
120				let targetContent = $('.pro_detail_wrap_01').offset().top;
121				let targetContentH = $('.pro_detail_wrap_01').outerHeight();
122				let spTargetContentH = $('.info__item.main.show__sp').outerHeight();
123				if (st < (targetContent + targetContentH - headerH - spTargetContentH)) {
124					productOrderBtn.removeClass('active');
125                    tableContentsSwitch.css('bottom','22vw');
126				} else {
127					productOrderBtn.addClass('active');
128                    tableContentsSwitch.css('bottom','38vw');
129				}
130			}
131		}
132		lastScrollTop = st;
133	});
134
135
136
137	$pageTop.click(function () {
138		$('body,html').animate({
139			scrollTop: 0
140		}, 600);
141		return false;

142	});
143
144	$('.nav__02 li a').click(function (event) {
145		var href = $(this).attr('href');
146
147		if (href === 'javascript:void(0)') {
148			// Thực hiện lệnh jQuery ở đây
149			$(this).toggleClass('active');
150			event.preventDefault();
151			var submenu = $(this).next('.ul');
152			if (submenu.is(':visible')) {
153				submenu.slideUp();
154			} else {
155				submenu.slideDown();
156			}
157		}
158	});
159
160
161
162
163
164	// header PC用メニューカテゴリ
165	let cat = $('.header .nav__02 .ul.cat').clone().addClass('pc_cat');
166	let body = $('.header .nav__02 .ul.body').clone().addClass('pc_cat');
167	let eventSale = $('.header .nav__02 .ul.event_sale').clone().addClass('pc_cat');
168    let medical = $('.header .nav__02 .ul.medical').clone().addClass('pc_cat');
169	let guide = $('.header .nav__02 .ul.guide').clone().addClass('pc_cat');
170	$('.header__gp-02 .cat_menu').append(cat);
171	$('.header__gp-02 .body_menu').append(body);
172	$('.header__gp-02 .event_sale_menu').append(eventSale);
173    $('.header__gp-02 .medical_menu').append(medical);
174	$('.header__gp-02 .guide_menu').append(guide);
175
176	$('.header__ul-03 .cat_menu > a').on('click' ,function(){
177		$('.header__ul-03 .ul').slideUp();
178		$(this).next('.ul').slideToggle();
179	});
180	$('.header__ul-03 .body_menu > a').on('click' ,function(){
181		$('.header__ul-03 .ul').slideUp();
182		$(this).next('.ul').slideToggle();
183	});
184	$('.header__ul-03 .event_sale_menu > a').on('click' ,function(){
185		$('.header__ul-03 .ul').slideUp();
186		$(this).next('.ul').slideToggle();
187	});
188    $('.header__ul-03 .medical_menu > a').on('click' ,function(){
189        $('.header__ul-03 .ul').slideUp();
190        $(this).next('.ul').slideToggle();
191    });
192	$('.header__ul-03 .guide_menu > a').on('click' ,function(){
193		$('.header__ul-03 .ul').slideUp();
194		$(this).next('.ul').slideToggle();
195	});
196	$(document).on('click', '.header__gp-02 .cat_list .toggle_mark', function(){
197		var clickedSubCatBox = $(this).next('.sub_cat_box');
198		$('.cat_list .toggle_mark').not(this).removeClass('active').next('.sub_cat_box').slideUp();
199		clickedSubCatBox.slideToggle();
200		$(this).toggleClass('active');
201	});
202	$(document).on('click', function(e) {
203		if ($(e.target).closest('.header__ul-03').length === 0) {
204			$('.header__ul-03 .ul').slideUp();
205		}
206	});
207
208	// header SP用メニューカテゴリ
209	$('.nav .nav__02 .ul .add .toggle_mark').on('click',function(){
210		$('.nav .nav__02 .ul .add .toggle_mark').not(this).removeClass('active').next('.sub_cat_box').slideUp();
211		$(this).next('.sub_cat_box').slideToggle();
212		$(this).toggleClass('active');
213	});
214
215
216	// トップ カテゴリから探す
217	$('.wrap__ul-01 .add .toggle_mark').on('click',function(){
218		$('.wrap__ul-01 .add .toggle_mark').not(this).removeClass('active').next('.sub_cat_box').slideUp();
219		$(this).next('.sub_cat_box').slideToggle();
220		$(this).toggleClass('active');
221	});
222	$(document).on('click', function(e) {
223		if ($(e.target).closest('.wrap__ul-01 li').length === 0) {
224			$('.wrap__ul-01 .add .sub_cat_box').slideUp();
225			$('.wrap__ul-01 .add .toggle_mark').removeClass('active');
226		}
227	});
228
229	// PC用ハンバーガーメニュー
230	$('.header__user-menu, .header__user-img img.show__sp').on('click',function(){
231		$(this).toggleClass('active');
232		$('.header__user-min_menu_box').slideToggle();
233	});
234	$(document).on('click', function(e) {
235		if ($(e.target).closest('.header__user-min_menu_box, .header__user').length === 0) {
236			$('.header__user-menu').removeClass('active');
237			$('.header__user-min_menu_box').slideUp();
238		}
239	});
240
241
242	// 商品詳細レビュー件数クリックで画面移動
243	$('.ul__ratio .review_data').on('click',function(){
244		let target = $('#reviewList').offset().top;
245		let head = $('.header').innerHeight();
246		let calc = target - head;
247		$('body,html').animate({
248			scrollTop: calc
249		}, 600);
250		return false;
251	});
252
253	//住所自動入力
254	const prefectureNameToCode = {
255		"北海道": 1,
256		"青森県": 2,
257		"岩手県": 3,
258		"宮城県": 4,
259		"秋田県": 5,
260		"山形県": 6,
261		"福島県": 7,
262		"茨城県": 8,
263		"栃木県": 9,
264		"群馬県": 10,
265		"埼玉県": 11,
266		"千葉県": 12,
267		"東京都": 13,
268		"神奈川県": 14,
269		"新潟県": 15,
270		"富山県": 16,
271		"石川県": 17,
272		"福井県": 18,
273		"山梨県": 19,
274		"長野県": 20,
275		"岐阜県": 21,
276		"静岡県": 22,
277		"愛知県": 23,
278		"三重県": 24,
279		"滋賀県": 25,
280		"京都府": 26,
281		"大阪府": 27,
282		"兵庫県": 28,
283		"奈良県": 29,
284		"和歌山県": 30,
285		"鳥取県": 31,
286		"島根県": 32,
287		"岡山県": 33,
288		"広島県": 34,
289		"山口県": 35,
290		"徳島県": 36,
291		"香川県": 37,
292		"愛媛県": 38,
293		"高知県": 39,
294		"福岡県": 40,
295		"佐賀県": 41,
296		"長崎県": 42,
297		"熊本県": 43,
298		"大分県": 44,
299		"宮崎県": 45,
300		"鹿児島県": 46,
301		"沖縄県": 47
302	};
303
304	// 郵便番号フィールドの監視
305	/*$('.p-postal-code').on('change', function() {
306		// YubinBangoによる自動住所入力が終わるのを少し待つ
307		setTimeout(function() {
308			const prefectureName = $('.p-region').val(); // YubinBangoによりセットされた都道府県名を取得
309			const prefectureCode = prefectureNameToCode[prefectureName]; // 都道府県名からコードを取得
310			if (prefectureCode) {
311				$('.p-region-id').val(prefectureCode); // 都道府県コードをセット
312			}
313		}, 100); // YubinBangoがDOMを更新するのを待つための遅延
314	});
315	*/
316
317	// 追加コンテンツのアコーディオン設定
318	function wrapElements(startElement, wrapperClass) {
319		let $startElement = $(startElement);
320		let startTag = $startElement.prop("tagName");
321		let elementsToWrap = $startElement.nextUntil(startTag);
322		elementsToWrap.wrapAll(`<div class="${wrapperClass}"></div>`);
323	}
324	$('h2.accordion, h3.accordion, h4.accordion').each(function() {
325		wrapElements(this, 'accordion_wrapper');
326	});
327	$(document).on('click', 'h2.accordion, h3.accordion, h4.accordion',function(){
328		$(this).toggleClass('active');
329		$(this).next('.accordion_wrapper').slideToggle();
330	});
331
332
333});
334
335//お気に入りアイコン
336$(document).on('click','.like',function(event){
337	event.preventDefault();
338});
339/*$(window).on('load resize' ,function (){
340	let win = $(window).innerWidth();
341	if (win <= 750) {
342		let foot = $('.footer__03');

343		let footH = foot.innerHeight();
344		$('#footer').css('padding-bottom', `${footH}px`);
345	} else {
346		$('#footer').css('padding-bottom', `33px`);
347	}
348});*/
349function myFunction(x) {
350	$('.nav').toggleClass("active");
351	$('html').toggleClass("windowLock");
352	$('#chatplusview').hide();
353}
354$(document).on('click', '.chane-x, .nav__menu', function() {
355	myFunction(this);
356});
357
358
359$(function() {
360	//　ご利用ガイド系の目次スクロール
361    function targetScroll(e) {
362        let target = $('h2[data-point="' + e + '"], h3[data-point="' + e + '"], h4[data-point="' + e + '"], .category_article_box[data-point="' + e + '"]');
363        if (target.length) {
364            let header = $('.header').innerHeight();
365            let targetOffset = target.offset().top - header;
366            $('html, body').animate({
367                scrollTop: targetOffset
368            }, 600);
369        }
370    }
371	$('.ul__guide-03 span').on('click', function() {
372		let point = $(this).data('point');
373        targetScroll(point);
374	});
375	let hash = window.location.hash.substring(1);
376	if (hash) {
377        targetScroll(hash);
378	}
379
380	//　製薬会社ガイドのアルファベットスクロール
381	$('.ul__guide-02 ul a').on('click', function() {
382		let point = $(this).data('point');
383		let target = $('.company__gp-box[data-point="' + point + '"]');
384		if (target.length) {
385			let header = $('.header').innerHeight();
386			let targetOffset = target.offset().top - header;
387			$('html, body').animate({
388				scrollTop: targetOffset
389			}, 600);
390		}
391	});
392});
393
394
395//お気に入り
396$(document).on('click', '.like', function(){
397	const merchandiseId = $(this).data('merchandiseid');
398
399	if(!merchandiseId){
400		return;
401	}
402
403	if ($(this).hasClass("isFavorite") === false) {
404		$.ajax({
405			type: "post",
406			url: "/favorites/add" + merchandiseId,
407			data: {
408				"merchandiseId" : merchandiseId,
409				"_formUuid" : "0a08571d-00d1-485e-b52c-8f2f8d811b4e"
410			},
411			dataType : "json"
412		}).done(function(response){
413			console.log(response);
414		}).fail(function(XMLHttpRequest, status, e){
415			console.error("お気に入りに追加の失敗", e);
416		});
417
418		$(this).addClass("isFavorite");
419	} else {
420		$.ajax({
421			type: "post",
422			url: "/favorites/del" + merchandiseId,
423			data: {
424				"merchandiseId" : merchandiseId,
425				"_formUuid" : "0a08571d-00d1-485e-b52c-8f2f8d811b4e"
426			},
427			dataType : "json"
428		}).done(function(response){
429			console.log(response);
430		}).fail(function(XMLHttpRequest, status, e){
431			console.error("お気に入りに削除の失敗", e);
432		});
433
434		$(this).removeClass("isFavorite");
435	}
436});
437
438// headerの高さ自動調整
439function headerHeight() {
440    let headerH = $('.header').innerHeight();
441    $('header').css('height',headerH);
442    if ($('.pro_detail__price').length) {
443        $('.pro_detail__price').css('top',headerH);
444    }
445}
446function headerHeight2() {
447    let headerH = $('.header').innerHeight();
448    let win = $(window).innerWidth();
449    let searchH;
450    if (win <= 1000) {
451        searchH = $('.searchWordBox').innerHeight();
452    } else {
453        searchH = 0;
454    }
455    $('header').css('height',headerH + searchH);
456    if ($('.pro_detail__price').length) {
457        $('.pro_detail__price').css('top',headerH + searchH);
458    }
459    $(window).on('scroll', function () {
460        $('.searchWordBox').hide();
461    });
462    headerHeight();
463}
464$(window).on('load resize',function(){
465    headerHeight();
466});
467$('.header__form.form_01 input').on('focus click',function(){
468    requestAnimationFrame(() => {
469        requestAnimationFrame(() => {
470            headerHeight2();
471        });
472    });
473});
474
475
476