https://www.matsujiro.shop/html/template/sasstyle1/js/function.js?v=3.0.15

1$(function () {
2
3    /////////// Drawer menu
4
5    $('.nav-trigger').on('click', function (event) {
6        event.preventDefault();
7        if ($('.drawer-open #drawer').size() == 0) {
8            $('.overlay').addClass('is-visible');
9            $('#wrapper').addClass('drawer-open');
10        } else {
11            $('#wrapper').removeClass('drawer-open');
12            $('.overlay').removeClass('is-visible');
13            toggleCart('close')
14        }
15        return false;
16    });
17
18    //open cart form
19    $('.cart-trigger').on('click', function (event) {
20        event.preventDefault();
21        toggleCart();
22        $('#wrapper').removeClass('drawer-open');
23
24    });
25
26    //close lateral menu on mobile
27    $('.overlay').on('swiperight', function () {
28        if ($('#wrapper').hasClass('drawer-open')) {
29            $('#wrapper').removeClass('drawer-open');
30            $('.overlay').removeClass('is-visible');
31        }
32    });
33    $('.overlay').on('click', function () {
34        $('#wrapper').removeClass('drawer-open');
35        toggleCart('close')
36        $('.overlay').removeClass('is-visible');
37    });
38
39    function toggleCart(type) {
40        if (type == "close") {
41            //close cart
42            $('.cart').removeClass('is-visible');
43            $('.cart-trigger').removeClass('cart-is-visible');
44            $('.overlay').removeClass('cart-is-visible');
45        } else {
46            //toggle cart visibility
47            $('.cart').toggleClass('is-visible');
48            $('.cart-trigger').toggleClass('cart-is-visible');
49            $('.overlay').toggleClass('cart-is-visible');
50            ($('.cart').hasClass('is-visible')) ? $('.overlay').addClass('is-visible') : $('.overlay').removeClass('is-visible');
51        }
52    }
53
54
55    /////////// category accordion
56    $("#category li .toggle").on('click', function () {
57        var togglepanel = $(this).parent('a').next('ul');
58        if (togglepanel.css("display") == "none") {
59            $(this).parent('a').addClass("active");
60            togglepanel.slideDown(300);
61        } else {
62            $(this).parent('a').removeClass("active");
63            togglepanel.slideUp(300);
64        }
65        return false;
66    });
67
68    /////////// アコーディオン
69    $(".accordion dl dt").on('click', function () {
70        if ($(this).parent('dl').children('dd').css('display') == 'none') {
71            $(this).addClass('active');
72            $(this).parent('dl').children('dd').slideDown(300);
73        } else {
74            $(this).removeClass('active');
75            $(this).parent('dl').children('dd').slideUp(300);
76        }
77        return false;
78    });
79
80    /////////// スムーススクロール
81    $('a.anchor').on('click', function () {
82        var speed = 400;//スクロール速度 単位：ミリ秒
83        var href = $(this).attr("href");
84        var destination = $(href == "#" || href == "" ? 'html' : href);
85        var position = destination.offset().top;
86        $("html,body").animate({scrollTop: position}, speed, 'swing');
87        return false;
88    });
89
90    /////////// dropdownの中をクリックしても閉じないようにする
91    $(".dropdown-menu").click(function (e) {
92        e.stopPropagation();
93    });
94
95    /////////// 追従サイドバー + ページトップフェードイン
96
97    // スクロールした時に以下の処理
98    $(window).on("scroll", function () {
99        // ページトップフェードイン
100        if ($(this).scrollTop() > 300) {
101            $('.pagetop').fadeIn();
102        } else {
103            $('.pagetop').fadeOut();
104        }
105
106        //PC表示の時のみに適用
107        if (window.innerWidth > 767) {
108
109            if ($('#shopping_confirm').length) {
110
111                var side0 = $("#confirm_side"),
112                    side = $("#summary_box__total_box"),
113                    wrap = $("#shopping_confirm"),
114                    min_move = wrap.offset().top,
115                    max_move = min_move + wrap.height() - side.height() - 2 * parseInt(side.css("top") ),
116                    margin_bottom = max_move - min_move;
117
118                var scrollTop = $(window).scrollTop();
119              //alert(side.height() + " min_move = " + min_move + " < scrollTop = " + scrollTop + " < max_move = " + max_move);
120                if (scrollTop > min_move && scrollTop < max_move) {
121                    var margin_top = scrollTop - min_move;
122                    side.css({"margin-top": margin_top});
123                  alert(margin_top);
124                  
125                } else if (scrollTop < min_move) {
126                    side.css({"margin-top": 0});
127                  
128                } else if (scrollTop > max_move) {
129                    side.css({"margin-top": margin_bottom});
130                  
131                }
132              //alert("scrollTop = " + scrollTop + " min_move = " + min_move);
133            }
134        } else {
135          
136        }
137        return false;

138    });
139
140    // マスク処理
141    $('.prevention-mask').on('click', function() {
142        $overlay = $('<div class="prevention-masked">');
143        $('body').append($overlay);
144    });
145
146    // ダブルクリック禁止
147    $('.prevention-btn').on('click', function() {
148        $(this).attr('disabled', 'disabled');
149        var $form = $(this).parents('form');
150        // マスク表示させるためsetTimeoutを使って処理を遅らせる
151        setTimeout(function(){
152            $form.submit();
153        }, 0);
154        return false;
155    });
156
157});
158
159
160/////////// ロールオーバー
161$.fn.rollover = function () {
162    return this.each(function () {
163        var src = $(this).attr('src');
164        if (src.match('_on.')) return;
165        var src_on = src.replace(/^(.+)(\.[a-z]+)$/, "$1_on$2");
166        $('').attr('src', src_on);
167        $(this).hover(
168            function () {
169                $(this).attr('src', src_on);
170            },
171            function () {
172                $(this).attr('src', src);
173            }
174        );
175    });
176};
177
178// 画像をロールオーバーする箇所(imgタグ)を指定
179$(function () {
180    $('.rollover').rollover();
181});
182
183
184/////////// 高さ揃え
185/**
186 * jquery.matchHeight-min.js v0.6.0
187 * http://brm.io/jquery-match-height/
188 * License: MIT
189 */
190(function (c) {
191    var n = -1, f = -1, g = function (a) {
192        return parseFloat(a) || 0
193    }, r = function (a) {
194        var b = null, d = [];
195        c(a).each(function () {
196            var a = c(this), k = a.offset().top - g(a.css("margin-top")), l = 0 < d.length ? d[d.length - 1] : null;
197            null === l ? d.push(a) : 1 >= Math.floor(Math.abs(b - k)) ? d[d.length - 1] = l.add(a) : d.push(a);
198            b = k
199        });
200        return d
201    }, p = function (a) {
202        var b = {byRow: !0, property: "height", target: null, remove: !1};
203        if ("object" === typeof a)return c.extend(b, a);
204        "boolean" === typeof a ? b.byRow = a : "remove" === a && (b.remove = !0);
205        return b
206    }, b = c.fn.matchHeight =
207        function (a) {
208            a = p(a);
209            if (a.remove) {
210                var e = this;
211                this.css(a.property, "");
212                c.each(b._groups, function (a, b) {
213                    b.elements = b.elements.not(e)
214                });
215                return this
216            }
217            if (1 >= this.length && !a.target)return this;
218            b._groups.push({elements: this, options: a});
219            b._apply(this, a);
220            return this
221        };
222    b._groups = [];
223    b._throttle = 80;
224    b._maintainScroll = !1;
225    b._beforeUpdate = null;
226    b._afterUpdate = null;
227    b._apply = function (a, e) {
228        var d = p(e), h = c(a), k = [h], l = c(window).scrollTop(), f = c("html").outerHeight(!0), m = h.parents().filter(":hidden");
229        m.each(function () {
230            var a = c(this);
231            a.data("style-cache", a.attr("style"))
232        });
233        m.css("display", "block");
234        d.byRow && !d.target && (h.each(function () {
235            var a = c(this), b = "inline-block" === a.css("display") ? "inline-block" : "block";
236            a.data("style-cache", a.attr("style"));
237            a.css({
238                display: b,
239                "padding-top": "0",
240                "padding-bottom": "0",
241                "margin-top": "0",
242                "margin-bottom": "0",
243                "border-top-width": "0",
244                "border-bottom-width": "0",
245                height: "100px"
246            })
247        }), k = r(h), h.each(function () {
248            var a = c(this);
249            a.attr("style", a.data("style-cache") || "")
250        }));
251        c.each(k, function (a, b) {
252            var e = c(b), f = 0;
253            if (d.target)f =
254                d.target.outerHeight(!1); else {
255                if (d.byRow && 1 >= e.length) {
256                    e.css(d.property, "");
257                    return
258                }
259                e.each(function () {
260                    var a = c(this), b = {display: "inline-block" === a.css("display") ? "inline-block" : "block"};
261                    b[d.property] = "";
262                    a.css(b);
263                    a.outerHeight(!1) > f && (f = a.outerHeight(!1));
264                    a.css("display", "")
265                })
266            }
267            e.each(function () {
268                var a = c(this), b = 0;
269                d.target && a.is(d.target) || ("border-box" !== a.css("box-sizing") && (b += g(a.css("border-top-width")) + g(a.css("border-bottom-width")), b += g(a.css("padding-top")) + g(a.css("padding-bottom"))), a.css(d.property,
270                    f - b))
271            })
272        });
273        m.each(function () {
274            var a = c(this);
275            a.attr("style", a.data("style-cache") || null)
276        });
277        b._maintainScroll && c(window).scrollTop(l / f * c("html").outerHeight(!0));
278        return this
279    };
280    b._applyDataApi = function () {
281        var a = {};
282        c("[data-match-height], [data-mh]").each(function () {
283            var b = c(this), d = b.attr("data-mh") || b.attr("data-match-height");
284            a[d] = d in a ? a[d].add(b) : b
285        });
286        c.each(a, function () {
287            this.matchHeight(!0)
288        })
289    };
290    var q = function (a) {
291        b._beforeUpdate && b._beforeUpdate(a, b._groups);
292        c.each(b._groups, function () {
293            b._apply(this.elements,
294                this.options)
295        });
296        b._afterUpdate && b._afterUpdate(a, b._groups)
297    };
298    b._update = function (a, e) {
299        if (e && "resize" === e.type) {
300            var d = c(window).width();
301            if (d === n)return;
302            n = d
303        }
304        a ? -1 === f && (f = setTimeout(function () {
305            q(e);
306            f = -1
307        }, b._throttle)) : q(e)
308    };
309    c(b._applyDataApi);
310    c(window).bind("load", function (a) {
311        b._update(!1, a)
312    });
313    c(window).bind("resize orientationchange", function (a) {
314        b._update(!0, a)
315    })
316})(jQuery);
317
318// 高さ揃えの要素を指定
319$(function () {
320
321    $('.pickup_item').matchHeight({
322        byRow: true,
323        property: 'height'
324    });
325
326    $('.product_item .item_name').matchHeight({
327        byRow: true,
328        property: 'height'
329    });
330    $('button.thumbnail').matchHeight({
331        byRow: true,
332        property: 'height'
333    });
334    $('#login_box > div').matchHeight({});
335});
336
337// anchorをクリックした時にformを裏で作って指定のメソッドでリクエストを飛ばす
338// Twigには以下のように埋め込む
339// <a href="PATH" {{ csrf_token_for_anchor() }} data-method="(put/delete/postのうちいずれか)" data-confirm="xx

339xx" data-message="xxxx">
340//
341// オプション要素
342// data-confirm : falseを定義すると確認ダイアログを出さない。デフォルトはダイアログを出す
343// data-message : 確認ダイアログを出す際のメッセージをデフォルトから変更する
344//
345$(function () {
346    var createForm = function (action, data) {
347        var $form = $('<form action="' + action + '" method="post"></form>');
348        for (input in data) {
349            if (data.hasOwnProperty(input)) {
350                $form.append('<input name="' + input + '" value="' + data[input] + '">');
351            }
352        }
353        return $form;
354    };
355
356    $('a[token-for-anchor]').click(function (e) {
357        e.preventDefault();
358        var $this = $(this);
359        var data = $this.data();
360        if (data.confirm != false) {
361            if (!confirm(data.message ? data.message : '削除してもよろしいですか?')) {
362                return false;
363            }
364        }
365
366        var $form = createForm($this.attr('href'), {
367            _token: $this.attr('token-for-anchor'),
368            _method: data.method
369        }).hide();
370
371        $('body').append($form); // Firefox requires form to be on the page to allow submission
372        $form.submit();
373    });
374});