component
InView Video
By Urbs Studio
Details
- Urbs StudioAuthor
- componentType
- 2026-05-12Published
- 2026-05-12Updated
- 2026-05-01Added
- PlayersCategories
Summary
Video that smartly fades audio in view.
Description
What it does This component automatically controls video playback and audio based on visibility. Audio fades in when the video enters view Audio fades out and mutes when it leaves Optional pause when out of view Prevents playback inside Framer canvas (only works in preview/live) Supports both uploaded files and external video URLs Why it matters Most sites with multiple videos feel chaotic because everything plays at once. This fixes that. It ensures: Focus stays on what’s currently visible No overlapping audio A smoother, more premium browsing experience Key Features Smooth audio fade-in / fade-out Viewport-based playback control Upload or URL video support Autoplay + loop options Responsive by default Works perfectly in Framer Preview (disabled in canvas) Clean object-fit + positioning controls Perfect for Landing pages Case study storytelling Product showcases Portfolio sites Agency websites (especially yours 👀) Controls Included Volume Fade duration Autoplay toggle Loop toggle Pause when out of view Visibility threshold Video fit + positioning Source type (Upload / URL)
Introduction
Video that smartly fades audio in view.
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #2956