diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx index 33c0665..842bc61 100644 --- a/client/src/components/netflix-grid.tsx +++ b/client/src/components/netflix-grid.tsx @@ -168,11 +168,11 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { const newX = prev + speed; const totalWidth = category.videos.length * videoWidth; - // Infinite loop - seamless reset - if (direction === 'right' && newX <= -totalWidth * 2) { - return -totalWidth; + // Infinite loop - seamless reset for continuous circular motion + if (direction === 'right' && newX <= -totalWidth) { + return newX + totalWidth; // Add one full cycle to continue seamlessly } else if (direction === 'left' && newX >= 0) { - return -totalWidth; + return newX - totalWidth; // Subtract one full cycle to continue seamlessly } return newX; @@ -198,11 +198,11 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) { const newX = prev + speed; const totalWidth = category.videos.length * videoWidth; - // Infinite loop - seamless reset - if (direction === 'right' && newX <= -totalWidth * 2) { - return -totalWidth; // Reset to middle section + // Infinite loop - seamless reset for continuous circular motion + if (direction === 'right' && newX <= -totalWidth) { + return newX + totalWidth; // Add one full cycle to continue seamlessly } else if (direction === 'left' && newX >= 0) { - return -totalWidth; // Reset to middle section + return newX - totalWidth; // Subtract one full cycle to continue seamlessly } return newX;