WP Manifestindependent plugin directory
manifest / media / ibaw-gsap-video-scroll

IBAW-GSAP Video Scroll Animation

A WordPress plugin that enqueues GSAP and ScrollTrigger to seamlessly scrub MP4 video playback on page scroll.

by Erick Villeta · github.com/ericksonvilleta/ibaw-gsap-video-scroll · website

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/ericksonvilleta/ibaw-gsap-video-scroll/archive/refs/heads/main.zip
Readme github.com/ericksonvilleta/ibaw-gsap-video-scroll ↗

A lightweight WordPress plugin that leverages GSAP and ScrollTrigger to seamlessly scrub through MP4 video playback as the user scrolls down the page.

Features

  • GSAP Integration: Automatically enqueues GSAP Core and ScrollTrigger from a reliable CDN.
  • Shortcode Implementation: Easily embed the scroll-animated video anywhere on your site using a simple shortcode.
  • Customizable Scroll Depth: Adjust the scroll_height parameter to control how long the user needs to scroll to finish the video, effectively acting as a playback speed controller.
  • Sticky Viewport Layout: Keeps the video pinned cleanly to the viewport while the scrubbing animation takes place.

Installation

  1. Create a folder named ibaw-gsap-video-scroll in your WordPress wp-content/plugins/ directory.
  2. Upload the ibaw-gsap-video-scroll.php file into this folder.
  3. Log in to your WordPress Admin Dashboard.
  4. Navigate to Plugins > Installed Plugins.
  5. Locate IBAW-GSAP Video Scroll Animation and click Activate.

Screenshots

1 2 3

Video

Play the video to see it in action

https://github.com/user-attachments/assets/07e2e466-00ae-4edf-863e-d3a31319e8b4

Usage

Insert the shortcode on any post, page, or page builder (such as an Elementor shortcode widget).

Standard Shortcode


[ibaw_scroll_video src="[https://yourdomain.com/wp-content/uploads/your-video.mp4](https://yourdomain.com/wp-content/uploads/your-video.mp4)"]