https://www.oojou.jp/wp/wp-content/themes/oojou2026/assets/js/spa.js

1
2$(function () {
3	//ブレークポイント設定
4	const breakpoint = 810;
5	
6	function thumbSlide(element, thumb) {
7		$(element).slick({
8			asNavFor: thumb,
9			infinite: true,
10			slidesToShow: 1,
11			slidesToScroll: 1,
12			arrows: true,
13			dots: false,
14			fade: true,
15			speed: 1000,
16			autoplaySpeed: 4000,
17			autoplay: true,
18			pauseOnFocus: false,
19			pauseOnHover: false,
20		});
21		$(thumb).slick({
22			asNavFor: element,
23			infinite: true,
24			slidesToShow: 11,
25			slidesToScroll: 1,
26			arrows: false,
27			dots: false,
28			focusOnSelect: true,
29			speed: 1000,
30			autoplaySpeed: 4000,
31			autoplay: true,
32			pauseOnFocus: false,
33			pauseOnHover: false,
34			responsive: [
35				{
36					breakpoint: 811,
37					settings: {
38						slidesToShow: 6,
39					}
40				},
41			]
42		});
43	}
44
45	thumbSlide('#rockbath_slide', '#rockbath_slide_thumb');
46	thumbSlide('#carbonated_slide', '#carbonated_slide_thumb');
47
48
49	let slideSetting = {
50		infinite: true,
51		slidesToShow: 1,
52		slidesToScroll: 1,
53		arrows: false,
54		dots: true,
55		speed: 1000,
56		autoplaySpeed: 4000,
57		autoplay: true,
58		pauseOnFocus: false,
59		pauseOnHover: false,
60	}
61	$('#rockbath_slide02').slick(slideSetting);
62	$('#rockbath_slide03').slick(slideSetting);
63	$('#carbonated_slide02').slick(slideSetting);
64	$('#carbonated_slide03').slick(slideSetting);
65	$('#carbonated_slide04').slick(slideSetting);
66	$('#relaxation_slide').slick(slideSetting);
67	$('#daytrip_slide').slick(slideSetting);
68
69	let slideSetting02 = {
70		infinite: true,
71		slidesToShow: 1,
72		slidesToScroll: 1,
73		arrows: false,
74		dots: true,
75		fade: true,
76		speed: 1000,
77		autoplaySpeed: 4000,
78		autoplay: true,
79		pauseOnFocus: false,
80		pauseOnHover: false,
81	}
82	$('#facility_slide01').slick(slideSetting02);
83	$('#facility_slide02').slick(slideSetting02);
84	
85});