https://koikeya-pridepotato.jp/assets/js/slider.js

1
2
3$(function () {
4    var ua = navigator.userAgent;
5    if ((ua.indexOf('iPhone') > 0) || ua.indexOf('iPod') > 0 || (ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0)) {
6        $('head').prepend('<meta name="viewport" content="width=device-width,initial-scale=1">');
7    } else {
8        $('head').prepend('<meta name="viewport" content="width=1280">');
9        $('.wrap').fadeIn(700);
10    }
11    runWhenPageReady(initFadeSliders);
12});
13
14function runWhenPageReady(callback) {
15    if (document.readyState === 'complete') {
16        callback();
17    } else {
18        $(window).on('load', callback);
19    }
20}
21
22
23
24
25var FADE_SLIDER_OPTIONS = {
26    autoplay: true,
27    dots: false,
28    infinite: true,
29    autoplaySpeed: 3000,
30    speed: 1000,
31    fade: true,
32    arrows: false,
33    pauseOnHover: false,
34    pauseOnFocus: false,
35    swipe: true
36};
37
38var MQ_SP = window.matchMedia('(max-width: 767px)');
39
40// .fade_slider … PC・SP両方 / .fade_slider-sp … SPのみ（イレギュラー）
41function initFadeSliders() {
42    if (typeof $.fn.slick !== 'function') return;
43
44    $('.fade_slider').each(function () {
45        bindFadeSlider($(this), 'all');
46    });
47    $('.fade_slider-sp').each(function () {
48        bindFadeSlider($(this), 'sp');
49    });
50
51    if (typeof Pace !== 'undefined') {
52        Pace.on('done', refreshFadeSliders);
53    }
54}
55
56function refreshFadeSliders() {
57    $('.fade_slider.slick-initialized, .fade_slider-sp.slick-initialized').each(function () {
58        $(this).slick('setPosition');
59    });
60}
61
62function bindFadeSlider($slider, mode) {
63    var $spOnlySlides = $slider.children('.fade_slider_in.sp_only');
64    var hasSpOnly = $spOnlySlides.length > 0;
65    var slideCount = $slider.children('.fade_slider_in').length;
66    if (slideCount <= 1) return;
67
68    function syncSpOnlySlides() {
69        if (!hasSpOnly) return;
70
71        if (MQ_SP.matches) {
72            $spOnlySlides.each(function () {
73                if (!$.contains($slider[0], this)) {
74                    $slider.append(this);
75                }
76            });
77        } else {
78            $spOnlySlides.detach();
79        }
80    }
81
82    function init() {
83        var shouldInit = mode === 'all' || MQ_SP.matches;
84
85        if ($slider.hasClass('slick-initialized')) {
86            $slider.slick('unslick');
87        }
88
89        syncSpOnlySlides();
90
91        var visibleCount = $slider.children('.fade_slider_in').length;
92        if (!shouldInit || visibleCount <= 1) return;
93
94        $slider.slick(FADE_SLIDER_OPTIONS);
95        $slider.bind('touchstart', function () {
96            return true;
97        });
98        refreshSliderAfterImages($slider);
99    }
100
101    init();
102
103    if (mode === 'sp' || hasSpOnly) {
104        if (MQ_SP.addEventListener) {
105            MQ_SP.addEventListener('change', init);
106        } else if (MQ_SP.addListener) {
107            MQ_SP.addListener(init);
108        }
109    }
110}
111
112function refreshSliderAfterImages($slider) {
113    $slider.slick('setPosition');
114
115    $slider.find('img').one('load', function () {
116        $slider.slick('setPosition');
117    }).each(function () {
118        if (this.complete) {
119            $(this).trigger('load');
120        }
121    });
122}