Portfolio Web J's Part

 

🧠 1. Mobile Menu Toggle

// Mobile Menu Toggle
const menuToggle = document.querySelector('.menu-toggle');
const navbar = document.querySelector('nav ul');

menuToggle.addEventListener('click', () => {
  navbar.classList.toggle('active');
});
  

🌟 2. Sticky Navbar on Scroll

// Sticky Navbar
window.addEventListener('scroll', () => {
  const header = document.querySelector('header');
  header.classList.toggle('sticky', window.scrollY > 50);
});
  

📩 3. Contact Form Validation

// Contact Form Validation
document.querySelector('form').addEventListener('submit', function(e){
  e.preventDefault();
  const name = document.querySelector('input[name="name"]').value;
  const email = document.querySelector('input[name="email"]').value;
  const message = document.querySelector('textarea').value;

  if(name === '' || email === '' || message === ''){
    alert('⚠️ Please fill all fields!');
  } else {
    alert('✅ Message Sent Successfully!');
    this.reset();
  }
});
  

🎯 4. Smooth Scroll Effect

// Smooth Scrolling for Navigation Links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
  anchor.addEventListener('click', function(e) {
    e.preventDefault();
    document.querySelector(this.getAttribute('href')).scrollIntoView({
      behavior: 'smooth'
    });
  });
});