https://www.vill.iitate.fukushima.jp/ssi/js/top-slideshow.js?20221226

1$(function () {
2
3	function mainphoto_slider() {
4		$('#top_photo').append('<div id="mp_control_box"><button type="button" id="mp_control_prev">前のスライド</button><button type="button" id="mp_control_next">次のスライド</button></div><div id="mp_control_box2"><button type="button" id="mp_control_pause">停止</button><button type="button" id="mp_control_play">再生</button></div>');
5		var slideObj = $('#top_photo_list');
6		slideObj.slick({
7			accessibility: true,
8			autoplay: true,
9			autoplaySpeed: 5000,
10			speed: 750,
11			initialSlide: 0,
12			//スライドの行数
13			// rows: 2, 
14			//各行に表示するスライド数
15			// slidesPerRow: 2, 
16			slidesToShow: 1,
17			slidesToScroll: 1,
18			centerMode: false,
19			centerPadding: 0,
20			infinite: true,
21			prevArrow: '#mp_control_prev',
22			nextArrow: '#mp_control_next',
23			easing: 'swing',
24			//フェイドインで切り替える
25			fade: false,
26			touchMove: true,
27			pauseOnFocus: true,
28			pauseOnHover: true,
29			touchThreshold: 15,
30			dots: true,
31			//ナビゲーションドットの設置場所
32			appendDots: '#mp_control_box2',
33			responsive: [{
34				breakpoint: 670,
35				settings: {
36					dots: false,
37					slidesToShow: 1,
38				}
39			}]
40		}).slick('slickPlay');
41
42		// slideObj.slick('slickPlay');
43		$('#mp_control_prev').on('click keypress', function () {
44			slideObj.slick('slickPrev');
45		});
46		$('#mp_control_next').on('click keypress', function () {
47			slideObj.slick('slickNext');
48		});
49		$('#mp_control_pause').on('click keypress', function () {
50			$('#mp_control_pause').hide();
51			$('#mp_control_play').show();
52			slideObj.slick('slickPause');
53		});
54		$('#mp_control_play').on('click keypress', function () {
55			$('#mp_control_play').hide();
56			$('#mp_control_pause').show();
57			slideObj.slick('slickPlay');
58		});
59	}
60	if ($('#top_photo_list > li').length > 1) {
61		mainphoto_slider();
62	}
63
64});