內容簡介
Scrollzee - Video Scroll 將影片播放與滾動位置直接綁定，讓使用者在滾動頁面時，影片畫面隨之變化，提供更流暢的互動體驗。
【主要功能】
• 兩種播放模式：影像幀序列或影片尋找
• 一鍵提取影像幀，無需伺服器端處理
• 在控制台內預覽，無需離開 wp-admin
• 可調整影像品質與壓縮設定
• 自動優化行動裝置顯示效果
• 支援 Gutenberg 區塊與 Elementor 小工具
外掛標籤
開發者團隊
原文外掛簡介
Scrollzee – Video Scroll ties video playback directly to scroll position. Instead of playing on a timer, the current frame is tied to how far the visitor has scrolled: scroll down, the video plays forward; scroll up, it plays backward.
Features
Two playback modes: Image Frame Sequence (recommended, smoothest) or Video Seek (quicker setup)
One-click frame extraction, runs in your browser, uploads to your Media Library, no server-side ffmpeg needed, and automatically cleans up old frames when you regenerate
In-admin scrub preview, test the scrub feel without leaving wp-admin
Adjustable frame image quality/compression
Adjustable smoothing/catch-up speed and scroll distance
Optional sticky pinning while scrubbing
Cover or contain fit, poster image support
“Player Height” setting: full screen, or match the video’s own aspect ratio to avoid cropping
Separate “Phone Height” override for phone-sized screens, so mobile doesn’t get cropped the same way as a full-screen desktop hero
Automatic mobile optimization (shorter scroll track, tighter tracking on phones)
Respects prefers-reduced-motion (shows a static frame instead of animating)
Native Gutenberg block and native Elementor widget, plus a plain shortcode: [scrollzee_video id="123"]
No jQuery/GSAP dependency on the frontend, lightweight vanilla JS
Assets only load on pages that actually use it
Which playback mode should I use?
Image Frame Sequence extracts the video into individual images once, then plays them back on scroll by picking the right image, no video decoding involved while scrolling. This is the smoothest option and is what sites like Apple’s product pages actually use under the hood.
Video Seek sets the video’s current time directly as you scroll. Quicker to set up, no extraction step, but can be less smooth depending on the device and how the video is encoded.
For Video Seek mode
If you notice choppiness, re-encode your source video so every frame is a keyframe:
ffmpeg -i input.mp4 -vcodec libx264 -crf 18 -g 1 -pix_fmt yuv420p output.mp4
My video looks cropped on phones
Try the “Phone Height” setting (a specific height in vh used only on phone-sized screens), or switch “Player Height” to “Match video aspect ratio”. A landscape video forced into a tall, full-screen phone box has to crop hard to fill it, either option gives it a shorter, more natural height instead.
