diff --git a/static/js/main.js b/static/js/main.js index 213201e..b663b88 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -322,18 +322,29 @@ const cvPaper = document.querySelector('.cv-paper'); if (!cvPaper) return; - // Convert percentage to scale factor (100 = 1.0, 150 = 1.5, etc.) - const scaleFactor = zoomValue / 100; + // Get current scale from the element (if any) + const currentTransform = cvPaper.style.transform; + const currentScaleMatch = currentTransform.match(/scale\(([\d.]+)\)/); + const currentScale = currentScaleMatch ? parseFloat(currentScaleMatch[1]) : 1.0; - // Preserve scroll position (matching existing toggle pattern) + // Convert percentage to scale factor (100 = 1.0, 150 = 1.5, etc.) + const newScale = zoomValue / 100; + + // Calculate scale ratio for scroll adjustment + const scaleRatio = newScale / currentScale; + + // Preserve visual position by adjusting scroll proportionally requestAnimationFrame(() => { const scrollTop = window.pageYOffset || document.documentElement.scrollTop; // Apply transform - cvPaper.style.transform = `scale(${scaleFactor})`; + cvPaper.style.transform = `scale(${newScale})`; - // Restore scroll position - window.scrollTo(0, scrollTop); + // Adjust scroll position to maintain visual stability + // When zooming in (scaleRatio > 1), scroll more to keep same content visible + // When zooming out (scaleRatio < 1), scroll less + const newScrollTop = scrollTop * scaleRatio; + window.scrollTo(0, newScrollTop); // Update display updateZoomDisplay(zoomValue);