Spaces:
Running
Running
File size: 5,360 Bytes
596874c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 |
// Mobile menu toggle functionality
document.addEventListener('DOMContentLoaded', function() {
const hamburger = document.getElementById('hamburger');
const navMobile = document.getElementById('navMobile');
// Add header scroll effect
const header = document.querySelector('.header');
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
const targetId = this.getAttribute('href');
if (targetId === '#' || !document.querySelector(targetId)) return;
e.preventDefault();
// Close mobile menu if open
if (hamburger && navMobile) {
hamburger.classList.remove('active');
navMobile.classList.remove('active');
document.body.style.overflow = '';
}
// Smooth scroll to target
const targetElement = document.querySelector(targetId);
if (targetElement) {
window.scrollTo({
top: targetElement.offsetTop - 80, // Account for fixed header
behavior: 'smooth'
});
}
});
});
// Header scroll effect
if (header) {
window.addEventListener('scroll', () => {
if (window.scrollY > 50) {
header.classList.add('scrolled');
} else {
header.classList.remove('scrolled');
}
});
// Initialize header state
if (window.scrollY > 50) {
header.classList.add('scrolled');
}
}
// Mobile menu toggle
if (hamburger && navMobile) {
hamburger.addEventListener('click', function(e) {
e.stopPropagation();
this.classList.toggle('active');
navMobile.classList.toggle('active');
document.body.style.overflow = navMobile.classList.contains('active') ? 'hidden' : '';
});
// Close mobile menu when clicking on a link
const mobileLinks = document.querySelectorAll('.nav-mobile-links a');
mobileLinks.forEach(link => {
link.addEventListener('click', () => {
hamburger.classList.remove('active');
navMobile.classList.remove('active');
document.body.style.overflow = '';
});
});
// Close mobile menu when clicking outside
document.addEventListener('click', (e) => {
if (!hamburger.contains(e.target) && !navMobile.contains(e.target)) {
hamburger.classList.remove('active');
navMobile.classList.remove('active');
document.body.style.overflow = '';
}
});
}
// Initialize Intersection Observer for fade-in animations
const fadeElements = document.querySelectorAll('.fade-in');
const observerOptions = {
threshold: 0.1,
rootMargin: '0px 0px -50px 0px'
};
const observer = new IntersectionObserver((entries, observer) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
observer.unobserve(entry.target);
}
});
}, observerOptions);
fadeElements.forEach(element => {
observer.observe(element);
});
// Add animation delay to credential cards
const cards = document.querySelectorAll('.credential-card');
cards.forEach((card, index) => {
card.style.animationDelay = `${index * 0.15}s`;
});
});
// Upcoming Book Projects Slider
function initProjectsSlider() {
const track = document.querySelector('.projects-slider .slider-track');
const cards = Array.from(track.children);
const leftArrow = document.querySelector('.projects-slider .slider-arrow.left');
const rightArrow = document.querySelector('.projects-slider .slider-arrow.right');
let currentIndex = 0;
const total = cards.length;
function getCardsToShow() {
if (window.innerWidth >= 900) return 3;
if (window.innerWidth >= 600) return 2;
return 1;
}
function updateSlider() {
const cardsToShow = getCardsToShow();
const cardWidth = cards[0].offsetWidth + 24; // card width + margin
track.style.transition = 'transform 0.5s cubic-bezier(.77,0,.18,1)';
track.style.transform = `translateX(-${currentIndex * cardWidth}px)`;
}
leftArrow.addEventListener('click', function() {
const cardsToShow = getCardsToShow();
currentIndex = (currentIndex - 1 + total) % total;
updateSlider();
});
rightArrow.addEventListener('click', function() {
const cardsToShow = getCardsToShow();
currentIndex = (currentIndex + 1) % total;
updateSlider();
});
window.addEventListener('resize', updateSlider);
updateSlider();
}
document.addEventListener('DOMContentLoaded', function() {
if (document.querySelector('.projects-slider')) {
initProjectsSlider();
}
});
|