https://kodomocchi-park.com/js/common.js?20260603

1
2// loading animation
3const webStorage = function () {
4    if (sessionStorage.getItem('visit')) {
5        $(".c-loading").css("display", "none");
6    } else {
7        sessionStorage.setItem('visit', 'true');
8        $(window).on('load', function() {
9
10                setTimeout( function() {
11                    $('.c-loading__text').addClass('show');
12                }, 510 );
13
14                setTimeout( function() {
15                    $('.c-loading__text').addClass('hide');
16                }, 2000 );
17
18                setTimeout( function() {
19                    $('body').addClass('show');
20                }, 2000 );
21
22                setTimeout( function() {
23                    $('.c-loading').addClass('hide');
24                }, 3700 );
25
26                setTimeout( function() {
27                    $('.c-header,.home-hero__header').addClass('show');
28                }, 2700 );
29            }
30        );
31    }
32}
33webStorage();
34
35
36//ハンバーガーメニュー
37$(function(){
38    var state = false;
39    var pos;
40
41    function toggleMenu() {
42        if (state == false) {
43            pos = $(window).scrollTop();
44            $('body').addClass('menu-active').css({'top': -pos});
45            $("body").css("overflow", "hidden");
46            state = true;
47        } else {
48            $('body').removeClass('menu-active').css({'top': 0});
49            $("body").css("overflow", "");
50            window.scrollTo(0, pos);
51            state = false;
52        }
53    }
54
55    $('.c-header__sp-toggle,.home-hero__sp-toggle').click(function (){
56        toggleMenu();
57    });
58
59    $('.c-sp-menu__close,.c-sp-menu a').click(function() {
60        $('body').removeClass('menu-active');
61        $("body").css("overflow", "");
62    });
63});
64
65//modal
66function openDownloadModal() {
67    closePaymentModal();
68    $("#downloadModal,.c-modal-bg").css("visibility", "inherit").css("opacity", "1");
69    $("body").css("overflow", "hidden"); // スクロールを無効化
70}
71function closeDownloadModal() {
72    $("#downloadModal,.c-modal-bg").css("visibility", "hidden").css("opacity", "0");
73    $("body").css("overflow", "auto"); // スクロールを有効化
74}
75function openPaymentModal() {
76    closeDownloadModal();
77    $("#paymentModal,.c-modal-bg").css("visibility", "inherit").css("opacity", "1");
78    $("body").css("overflow", "hidden"); // スクロールを無効化
79}
80function closePaymentModal() {
81    $("#paymentModal,.c-modal-bg").css("visibility", "hidden").css("opacity", "0");
82    $("body").css("overflow", "auto"); // スクロールを有効化
83}
84$(document).ready(function() {
85    // modal
86    $(".js-open-download-modal").click(openDownloadModal);
87
88    $(".js-close-download-modal").click(closeDownloadModal);
89
90    $(".js-open-payment-modal").click(openPaymentModal);
91
92    $(".js-close-payment-modal").click(closePaymentModal);
93
94    $(window).click(function(event){
95        if(event.target == document.getElementById("downloadModal")){
96            closeDownloadModal();
97        }
98        if(event.target == document.getElementById("paymentModal")){
99            closePaymentModal();
100        }
101    });
102});
103
104//plan accordion
105document.querySelectorAll('.c-plan-accordion').forEach((accordion) => {
106    const head = accordion.querySelector('.c-plan-accordion__head');
107    const body = accordion.querySelector('.c-plan-accordion__body');
108
109    head.addEventListener('click', () => {
110        const isOpen = accordion.classList.contains('is-open');
111
112        if (isOpen) {
113            body.style.maxHeight = body.scrollHeight + 'px';
114
115            requestAnimationFrame(() => {
116                body.style.maxHeight = '0px';
117            });
118
119            accordion.classList.remove('is-open');
120        } else {
121            accordion.classList.add('is-open');
122            body.style.maxHeight = body.scrollHeight + 'px';
123        }
124    });
125
126    body.addEventListener('transitionend', () => {
127        if (accordion.classList.contains('is-open')) {
128            body.style.maxHeight = 'none';
129        }
130    });
131});
132
133//data-target
134$(function(){
135    $(window).scroll(function (){
136        $('[data-target]').each(function(){

137            var elemPos = $(this).offset().top;
138            var scroll = $(window).scrollTop();
139            var windowHeight = $(window).height();
140            if (scroll > elemPos - windowHeight + 200){
141                $(this).addClass('action');
142            }
143        });
144    });
145});