69 lines
2.1 KiB
JavaScript
69 lines
2.1 KiB
JavaScript
// BULMA BURGER MENU
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const burgers = Array.from(document.querySelectorAll('.navbar-burger'));
|
|
|
|
burgers.forEach(burger => {
|
|
burger.addEventListener('click', () => {
|
|
const targetId = burger.dataset.target;
|
|
const targetMenu = document.getElementById(targetId);
|
|
|
|
burger.classList.toggle('is-active');
|
|
targetMenu.classList.toggle('is-active');
|
|
});
|
|
});
|
|
|
|
// DARK MODE
|
|
const switchTheme = document.querySelector("#switch");
|
|
|
|
switchTheme.addEventListener("click", function () {
|
|
document.body.classList.toggle("dark-mode");
|
|
});
|
|
|
|
// CAROUSSEL
|
|
const track = document.querySelector('.carousel-track');
|
|
let index = 0;
|
|
|
|
function updateSlide() {
|
|
const slideWidth = document.querySelector('.carousel-slide').offsetWidth;
|
|
track.style.transform = `translateX(-${index * slideWidth}px)`;
|
|
}
|
|
|
|
setInterval(() => {
|
|
index = (index + 1) % document.querySelectorAll('.carousel-slide').length;
|
|
updateSlide();
|
|
}, 3000);
|
|
|
|
|
|
// TRICKY BOUTON
|
|
const container = document.querySelector('.button-area');
|
|
const button = document.getElementById('trickyButton');
|
|
|
|
button.addEventListener('mouseenter', () => {
|
|
const maxX = container.clientWidth - button.offsetWidth;
|
|
const maxY = container.clientHeight - button.offsetHeight;
|
|
|
|
const randomX = Math.floor(Math.random() * maxX);
|
|
const randomY = Math.floor(Math.random() * maxY);
|
|
|
|
button.style.left = `${randomX}px`;
|
|
button.style.top = `${randomY}px`;
|
|
});
|
|
|
|
// COMPTEUR
|
|
let compteur = 0;
|
|
document.getElementById("incrementer").addEventListener("click", () => {
|
|
compteur++;
|
|
document.getElementById("compteur").textContent = compteur;
|
|
});
|
|
|
|
// ADDITION
|
|
document.getElementById("additionner").addEventListener("click", () => {
|
|
const a = parseFloat(document.getElementById('chiffre1').value);
|
|
const b = parseFloat(document.getElementById('chiffre2').value);
|
|
const somme = a + b;
|
|
document.getElementById('resultat').textContent = somme;
|
|
document.getElementById('resultBox').style.display = "block";
|
|
});
|
|
});
|
|
|
