https://www.fondazionefamigliapiacenza.org/assets/js/hide-show-el-footer.js?date=1790070281

1(function () {
2    // ==========================
3    // CONFIGURAZIONE
4    // ==========================
5    const SOGLIA_PX = 20;                      // distanza dal fondo pagina (desktop), modificabile
6    const SOGLIA_PX_MOBILE = 130;               // distanza dal fondo pagina su mobile, modificabile
7    const BREAKPOINT_MOBILE = 768;             // larghezza (px) sotto la quale si considera "mobile", modificabile
8    const SELETTORE = '#back_to_top, #accessibility-toggle';   // id/classi da nascondere, modificabile
9    const DURATA_TRANSIZIONE = '0.3s';          // velocità del fade, modificabile
10
11    const CLASSE_BASE = 'fade-scroll-target';
12    const CLASSE_NASCOSTO = 'fade-nascosto';
13
14    // ==========================
15    // INIEZIONE CSS (animazione)
16    // ==========================
17    function iniettaCSS() {
18        const style = document.createElement('style');
19        style.textContent = `
20      .${CLASSE_BASE} {
21        transition: opacity ${DURATA_TRANSIZIONE} ease, visibility ${DURATA_TRANSIZIONE} ease;
22      }
23      .${CLASSE_BASE}.${CLASSE_NASCOSTO} {
24        opacity: 0;
25        visibility: hidden;
26        pointer-events: none;
27      }
28    `;
29        document.head.appendChild(style);
30    }
31
32    // ==========================
33    // LOGICA DI SCROLL
34    // ==========================
35    function sogliaAttuale() {
36        const eMobile = window.innerWidth <= BREAKPOINT_MOBILE;
37        return eMobile ? SOGLIA_PX_MOBILE : SOGLIA_PX;
38    }
39
40    function vicinoAlFondo() {
41        const scrollTop = window.scrollY || document.documentElement.scrollTop;
42        const altezzaViewport = window.innerHeight;
43        const altezzaDocumento = document.documentElement.scrollHeight;
44
45        return (altezzaDocumento - (scrollTop + altezzaViewport)) <= sogliaAttuale();
46    }
47
48    function inizializzaElementi() {
49        document.querySelectorAll(SELETTORE).forEach((el) => {
50            el.classList.add(CLASSE_BASE);
51        });
52    }
53
54    function nascondiElementi() {
55        document.querySelectorAll(SELETTORE).forEach((el) => {
56            el.classList.add(CLASSE_NASCOSTO);
57        });
58    }
59
60    function mostraElementi() {
61        document.querySelectorAll(SELETTORE).forEach((el) => {
62            el.classList.remove(CLASSE_NASCOSTO);
63        });
64    }
65
66    let statoNascosto = false;
67
68    function gestisciScroll() {
69        const vicino = vicinoAlFondo();
70
71        if (vicino && !statoNascosto) {
72            nascondiElementi();
73            statoNascosto = true;
74        } else if (!vicino && statoNascosto) {
75            mostraElementi();
76            statoNascosto = false;
77        }
78    }
79
80    // ==========================
81    // AVVIO
82    // ==========================
83    let ticking = false;
84    window.addEventListener('scroll', () => {
85        if (!ticking) {
86            window.requestAnimationFrame(() => {
87                gestisciScroll();
88                ticking = false;
89            });
90            ticking = true;
91        }
92    });
93
94    window.addEventListener('resize', () => {
95        if (!ticking) {
96            window.requestAnimationFrame(() => {
97                gestisciScroll();
98                ticking = false;
99            });
100            ticking = true;
101        }
102    });
103
104    document.addEventListener('DOMContentLoaded', () => {
105        iniettaCSS();
106        inizializzaElementi();
107        gestisciScroll();
108    });
109})();