This commit is contained in:
2025-03-02 12:01:00 +01:00
parent 09a1e18f16
commit 4d4ccb80a9
7 changed files with 147 additions and 47 deletions

View File

@@ -26,7 +26,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony default export */
\******************************************/
/***/ (function() {
eval("document.addEventListener('scroll', function() {\n const scrolled = window.pageYOffset;\n const background = document.getElementById('background-animated-live');\n if (background) {\n // Adjust this value to control the speed of the parallax effect\n const parallaxSpeed = 0.5;\n background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)';\n }\n});\n\n\n\n\n //ANimation Pilliers \n// const svg = document.querySelector('#paragraph-id--7 .colone-picto');\n\n// // Configuration de l'observateur d'intersection\n// const observer = new IntersectionObserver(entries => {\n// entries.forEach(entry => {\n// if (entry.isIntersecting) {\n// // Ajoute une classe lorsque l'élément est visible\n// svg.classList.add('visible');\n// } else {\n// // Optionnel : Retirez la classe si nécessaire\n// svg.classList.remove('visible');\n// }\n// });\n// });\n\n// // Observer l'élément SVG\n// observer.observe(svg);\n\n//////////////////////////////////////////////////\n\n//ANimation Pilliers \nconst svg = document.querySelector('#paragraph-id--7 .colone-picto');\n\nif (svg) {\n // Configuration de l'observateur d'intersection\n const observer = new IntersectionObserver(entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n // Ajoute une classe lorsque l'élément est visible\n // svg.classList.remove('invisible');\n svg.classList.add('visible');\n } \n // else {\n // // Optionnel : Retirez la classe si nécessaire\n // svg.classList.remove('visible');\n \n // }\n });\n });\n \n // Observer l'élément SVG\n observer.observe(svg);\n \n}\n\n\n//# sourceURL=webpack://quartiers_de_demain/./src/assets/js/animated_formes.js?");
eval("document.addEventListener('scroll', function() {\n const scrolled = window.pageYOffset;\n const background = document.getElementById('background-animated');\n if (background) {\n // Adjust this value to control the speed of the parallax effect\n const parallaxSpeed = 0.5;\n background.style.transform = 'translateY(' + (scrolled * parallaxSpeed) + 'px)';\n }\n});\n\n\n\n\n //ANimation Pilliers \n// const svg = document.querySelector('#paragraph-id--7 .colone-picto');\n\n// // Configuration de l'observateur d'intersection\n// const observer = new IntersectionObserver(entries => {\n// entries.forEach(entry => {\n// if (entry.isIntersecting) {\n// // Ajoute une classe lorsque l'élément est visible\n// svg.classList.add('visible');\n// } else {\n// // Optionnel : Retirez la classe si nécessaire\n// svg.classList.remove('visible');\n// }\n// });\n// });\n\n// // Observer l'élément SVG\n// observer.observe(svg);\n\n//////////////////////////////////////////////////\n\n//ANimation Pilliers \nconst svg = document.querySelector('#paragraph-id--7 .colone-picto');\n\nif (svg) {\n // Configuration de l'observateur d'intersection\n const observer = new IntersectionObserver(entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n // Ajoute une classe lorsque l'élément est visible\n // svg.classList.remove('invisible');\n svg.classList.add('visible');\n } \n // else {\n // // Optionnel : Retirez la classe si nécessaire\n // svg.classList.remove('visible');\n \n // }\n });\n });\n \n // Observer l'élément SVG\n observer.observe(svg);\n \n}\n\n\n//# sourceURL=webpack://quartiers_de_demain/./src/assets/js/animated_formes.js?");
/***/ }),

View File

@@ -1693,7 +1693,7 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
}
}
#home #background-animated-live {
#home #background-animated {
position: absolute;
top: 1500px;
left: 200px;
@@ -1702,11 +1702,11 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h
z-index: 2; /* S'assure que l'élément soit au-dessus */
}
@media (max-width: 1400px) {
#home #background-animated-live {
#home #background-animated {
display: none;
}
}
#home #background-animated-live svg {
#home #background-animated svg {
max-width: 100%;
position: relative;
top: -1500px;