sebastjan/folx-tv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prevent scrolling on the underlying page when the image lightbox is open

Browse Source 
Disable body scrolling and touch move events when the image lightbox is active to prevent the background page from scrolling.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 23852c00-4779-460a-9e0c-d09fee4b6c92
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 13ff6865-3caa-4778-a4a6-edf3608199e7
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/23852c00-4779-460a-9e0c-d09fee4b6c92/ncMMRQ9
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sebastjanartic
2026-03-06 11:29:36 +00:00
parent cc0a4682c6
commit a1dd9a1414
1 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/photo-gallery.tsx
+7
View File
@@ -84,12 +84,19 @@ function Lightbox({
return () => window.removeEventListener("keydown", handler); return () => window.removeEventListener("keydown", handler);
}, [onClose, prev, next]); }, [onClose, prev, next]);
useEffect(() => {
const orig = document.body.style.overflow;
document.body.style.overflow = "hidden";
return () => { document.body.style.overflow = orig; };
}, []);
const current = images[index]; const current = images[index];
return ( return (
<div <div
className="fixed inset-0 z-50 bg-black/95 flex items-center justify-center" className="fixed inset-0 z-50 bg-black/95 flex items-center justify-center"
onClick={onClose} onClick={onClose}
onTouchMove={(e) => e.preventDefault()}
data-testid="lightbox-overlay" data-testid="lightbox-overlay"
> >
<button <button