https://www.gransta.jp/cp/tokyo_teiban/assets/js/common.js

1// スムーススクロール
2$('a[href^="#"]').click(function () {
3  let speed = 500;
4  let href = $(this).attr("href");
5  let target = $(href == "#" || href == "" ? "html" : href);
6  let position = target.offset().top;
7  $("html, body").animate({ scrollTop: position }, speed, "swing");
8  return false;
9});
10
11// ソートボタンアコーディオン
12$(".js-toggleButton").on("click", function (e) {
13  $(e.target).next().slideToggle();
14  if ($(e.target).attr("data-open") === "false") {
15    $(e.target).attr("data-open", "true");
16  } else {
17    $(e.target).attr("data-open", "false");
18  }
19});
20
21// ページトップボタンスクロールトグル
22(function () {
23  var timerId = null;
24  var $pagetop = $(".pagetop");
25  $(window).on("scroll", function () {
26    if (timerId) return;
27    timerId = setTimeout(function () {
28      var scrollTop = $(window).scrollTop();
29      if (scrollTop > window.innerHeight / 2) {
30        $pagetop.fadeIn();
31      } else {
32        $pagetop.fadeOut();
33      }
34      timerId = null;
35    }, 1000 / 30);
36  });
37})();
38
39// WebP対応
40function support_format_webp() {
41  var elem = document.createElement("canvas");
42
43  if (!!(elem.getContext && elem.getContext("2d"))) {
44    return elem.toDataURL("image/webp").indexOf("data:image/webp") == 0;
45  } else {
46    return false;
47  }
48}
49
50// lazyLoad
51window.addEventListener("DOMContentLoaded", function () {
52  if (document.querySelector(".lozad")) {
53    if (support_format_webp()) {
54      var images = document.querySelectorAll(".lozad");
55      Array.prototype.forEach.call(images, function (image) {
56        image.dataset.src = image.dataset.src.replace(/.png|.jpg/gi, ".webp");
57      });
58    }
59    var observer = lozad(".lozad", { rootMargin: "0% 0% 50% 0%" });
60    observer.observe();
61  }
62});