Sites-Camelia/branches/alt+tab/scripts.js

56 lines
1.9 KiB
JavaScript
Raw Normal View History

// Fonction pour les images de fond en section 1
document.addEventListener("DOMContentLoaded", function () {
const bgElements = document.querySelectorAll('.set-bg');
bgElements.forEach(function (element) {
const bg = element.getAttribute('data-setbg');
if (bg) {
element.style.backgroundImage = `url(${bg})`;
}
});
});
// Fonction du menu de défilement
document.addEventListener('DOMContentLoaded', function () {
const dots = document.querySelectorAll('.dot');
const sections = document.querySelectorAll('section');
// Fonction pour le défilement fluide
function scrollToSection(sectionId) {
const section = document.querySelector(sectionId);
section.scrollIntoView({ behavior: 'smooth' });
}
// Ajouter l'événement de clic sur chaque rond
dots.forEach((dot) => {
dot.addEventListener('click', function (event) {
event.preventDefault();
scrollToSection(dot.getAttribute('href'));
// Mise à jour de l'état actif des ronds
dots.forEach(d => d.classList.remove('active'));
dot.classList.add('active');
});
});
// Détection automatique pour activer le rond correspondant lors du scroll
window.addEventListener('scroll', function () {
let currentSection = '';
sections.forEach(section => {
const sectionTop = section.offsetTop;
const sectionHeight = section.clientHeight;
if (window.pageYOffset >= sectionTop - sectionHeight / 3) {
currentSection = section.getAttribute('id');
}
});
dots.forEach(dot => {
dot.classList.remove('active');
if (dot.getAttribute('href') === `#${currentSection}`) {
dot.classList.add('active');
}
});
});
});