From 5c03902abced818d6c0bc365063ab04a875cc54d Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 16 Dec 2025 16:40:10 +0000 Subject: [PATCH 1/2] Initial plan From fbb8f5a7328ae485ad36f1f23c8ecb1c065926e3 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 16 Dec 2025 16:45:09 +0000 Subject: [PATCH 2/2] Implement website efficiency improvements Co-authored-by: techdiwas <209884248+techdiwas@users.noreply.github.com> --- index.html | 5 ++++- script.js | 29 ++++++++++++++++++++++++----- style.css | 12 ++++++++++-- 3 files changed, 38 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 567deb4..b67b39c 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,9 @@ Diwas | Portfolio + + + @@ -74,6 +77,6 @@

Contact

© 2025 Diwas. All rights reserved.

- + diff --git a/script.js b/script.js index 970417f..74a4c99 100644 --- a/script.js +++ b/script.js @@ -1,9 +1,28 @@ -// Simple scroll fade-in -window.addEventListener('scroll', () => { - document.querySelectorAll('section').forEach(section => { +// Throttle function for better performance +function throttle(func, delay) { + let lastCall = 0; + return function(...args) { + const now = Date.now(); + if (now - lastCall >= delay) { + lastCall = now; + func.apply(this, args); + } + }; +} + +// Simple scroll fade-in with throttling +const handleScroll = throttle(() => { + const sections = document.querySelectorAll('section'); + const windowHeight = window.innerHeight; + + sections.forEach(section => { const rect = section.getBoundingClientRect(); - if(rect.top < window.innerHeight - 50) { + if(rect.top < windowHeight - 50) { section.classList.add('visible'); } }); -}); +}, 100); + +window.addEventListener('scroll', handleScroll, { passive: true }); +// Trigger on load to handle initial viewport +handleScroll(); diff --git a/style.css b/style.css index ee9d6c1..3c7de41 100644 --- a/style.css +++ b/style.css @@ -128,6 +128,14 @@ nav.scroll-header ul li a:hover { section { padding: 100px 20px; text-align: center; + opacity: 0; + transform: translateY(20px); + transition: opacity 0.6s ease, transform 0.6s ease; +} + +section.visible { + opacity: 1; + transform: translateY(0); } #projects .project-list { @@ -182,11 +190,11 @@ footer { padding: 10px; background-color: #111; border-bottom: 1px solid #333; - scrollbar-width: none; /* Firefox */ + scrollbar-width: none; } .scrollable-top::-webkit-scrollbar { - display: none; /* Chrome, Safari */ + display: none; } .scroll-item {