Spaces:
Running
Running
File size: 3,854 Bytes
92d1e54 | 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 | // PRELOADER
window.addEventListener('load', () => {
const fill = document.getElementById('preloader-fill');
const preloader = document.getElementById('preloader');
fill.style.width = '100%';
setTimeout(() => {
preloader.classList.add('hidden');
}, 1800);
});
// CUSTOM CURSOR
const cursor = document.getElementById('cursor');
const follower = document.getElementById('cursor-follower');
let mouseX = 0, mouseY = 0, follX = 0, follY = 0;
document.addEventListener('mousemove', (e) => {
mouseX = e.clientX;
mouseY = e.clientY;
cursor.style.left = mouseX + 'px';
cursor.style.top = mouseY + 'px';
});
function animateFollower() {
follX += (mouseX - follX) * 0.12;
follY += (mouseY - follY) * 0.12;
follower.style.left = follX + 'px';
follower.style.top = follY + 'px';
requestAnimationFrame(animateFollower);
}
animateFollower();
// Scale cursor on interactive elements
document.querySelectorAll('a, button, .work-card, .service-card').forEach(el => {
el.addEventListener('mouseenter', () => {
cursor.style.transform = 'translate(-50%, -50%) scale(2)';
follower.style.width = '60px';
follower.style.height = '60px';
follower.style.borderColor = 'rgba(201,243,29,0.6)';
});
el.addEventListener('mouseleave', () => {
cursor.style.transform = 'translate(-50%, -50%) scale(1)';
follower.style.width = '36px';
follower.style.height = '36px';
follower.style.borderColor = 'rgba(201,243,29,0.5)';
});
});
// NAV SCROLL
const nav = document.getElementById('nav');
window.addEventListener('scroll', () => {
nav.classList.toggle('scrolled', window.scrollY > 50);
});
// MOBILE MENU
const toggle = document.getElementById('nav-toggle');
const mobileMenu = document.getElementById('mobile-menu');
toggle.addEventListener('click', () => {
mobileMenu.classList.toggle('open');
document.body.style.overflow = mobileMenu.classList.contains('open') ? 'hidden' : '';
});
document.querySelectorAll('.mobile-link').forEach(link => {
link.addEventListener('click', () => {
mobileMenu.classList.remove('open');
document.body.style.overflow = '';
});
});
// SCROLL REVEAL
const revealElements = document.querySelectorAll('.work-card, .service-card, .testi-card, .about-text, .about-img-wrap, .contact-left, .contact-right');
revealElements.forEach(el => el.classList.add('reveal'));
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry, i) => {
if (entry.isIntersecting) {
setTimeout(() => entry.target.classList.add('visible'), 100);
}
});
}, { threshold: 0.1 });
revealElements.forEach(el => observer.observe(el));
// CONTACT FORM
document.getElementById('contact-form').addEventListener('submit', (e) => {
e.preventDefault();
const btn = e.target.querySelector('button');
btn.textContent = 'Sending...';
btn.style.opacity = '0.7';
setTimeout(() => {
btn.textContent = 'Message Sent! ✓';
btn.style.opacity = '1';
btn.style.background = '#22c55e';
e.target.reset();
setTimeout(() => {
btn.textContent = 'Send Message →';
btn.style.background = '';
}, 3000);
}, 1500);
});
// PARALLAX ORBS
window.addEventListener('mousemove', (e) => {
const x = (e.clientX / window.innerWidth - 0.5) * 20;
const y = (e.clientY / window.innerHeight - 0.5) * 20;
document.querySelector('.orb-1').style.transform = `translate(${x}px, ${y}px)`;
document.querySelector('.orb-2').style.transform = `translate(${-x * 0.7}px, ${-y * 0.7}px)`;
document.querySelector('.orb-3').style.transform = `translate(${x * 0.5}px, ${y * 0.5}px)`;
});
// STAGGER work cards
document.querySelectorAll('.work-card').forEach((card, i) => {
card.style.transitionDelay = (i * 0.1) + 's';
});
document.querySelectorAll('.service-card').forEach((card, i) => {
card.style.transitionDelay = (i * 0.08) + 's';
});
|