ateliers55/user/themes/ateliers-55/js/script.js

81 lines
2.2 KiB
JavaScript
Raw Normal View History

2024-03-26 14:22:54 +01:00
function toggleMenu(el) {
let nav = document.querySelector('nav');
el.classList.toggle('open');
nav.classList.toggle('open');
}
function toggleAbout() {
let arrow = document.querySelector('#about-arrow');
let aboutContent = document.querySelector('#about-hidden');
aboutContent.classList.toggle('open');
arrow.classList.toggle('open');
}
$(document).ready(function() {
let body = document.querySelector('body');
if (document.querySelector('.swiper')) {
body.style.overflowY = "hidden";
} else {
body.style.overflowY = "auto";
}
let swiperEl = document.querySelector('.swiper');
2024-04-21 18:29:43 +02:00
if (swiperEl) {
swiperEl.style.opacity = 1;
2024-04-21 18:48:08 +02:00
resizeVerticalImages();
2024-04-21 18:29:43 +02:00
}
2024-03-26 14:22:54 +01:00
initSwiper();
barba.init({
transitions: [{
name: 'opacity-transition',
leave(data) {
return gsap.to(data.current.container, {
opacity: 0
})
},
enter(data) {
return gsap.from(data.next.container, {
opacity: 0
})
}
}]
});
barba.hooks.before((data) => {
2024-04-21 18:29:43 +02:00
if (swiperEl) {
swiperEl.style.opacity = 0;
}
2024-03-26 14:22:54 +01:00
});
barba.hooks.after((data) => {
swiperEl = document.querySelector('.swiper');
2024-04-21 18:29:43 +02:00
if (swiperEl) {
if (document.querySelector('.swiper') && !document.querySelector('.swiper-initialized')) {
initSwiper();
body.style.overflowY = "hidden";
}
swiperEl.style.opacity = 1;
2024-03-26 14:22:54 +01:00
} else {
body.style.overflowY = "auto";
}
2024-04-21 18:48:08 +02:00
resizeVerticalImages();
2024-03-26 14:22:54 +01:00
});
})
function initSwiper() {
let swiper = new Swiper('.swiper', {
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
}
function resizeVerticalImages() {
2024-04-21 18:48:08 +02:00
let verticalImages = document.querySelectorAll('.swiper-slide > img');
for (let img of verticalImages) {
console.log(img.clientHeight > img.clientWidth);
if (img.clientHeight > img.clientWidth) {
console.log("yes");
img.style.width = "50%";
2024-03-26 14:22:54 +01:00
}
}
}