wires/hypnagaga
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

advanced use docs

Browse source
This commit is contained in:
Sudev Kiyada 2025-07-24 16:06:38 +05:30
parent e11c032709
commit cb8269e54c
Failed to extract signature
1 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/components/ScrollerVideo/ScrollerVideo.mdx
View file

@ -390,12 +390,17 @@ Using the methods attached to the bindable prop `scrollerVideo` allows for advan
This code below would make the video smoothly jump to the halfway point of the video. Setting `jump` to `true` will make the video jump to the specified percentage abruptly:
```js
scrollerVideo.setVideoPercentage(0.5, {
jump: false,
});
scrollerVideo.setVideoPercentage(
0.5, // progress set to 50%
{
transitionSpeed: 12, // playback rate for the video
jump: false, // flag to change transition video abruptly
easing: (t) => t, // linear easing. Can also pass d3 easing functions - d3.easeLinear
}
);
```
> **Note**: When using these methods, set `trackScroll` to `false` and pass functions to the `onReady` prop to ensure that the video is ready before calling any methods on it.
> **Note**: When using these methods, it's recommended to set `trackScroll` to `false` to avoid video playback on scroll and pass functions to the `onReady` prop to ensure that the video is ready before calling any methods on it.
Here is a [demo](?path=/story/components-graphics-scrollervideo--advanced) that uses `ScrollerVideo` with `ScrollerBase` to make the video jump to the start or the end of the video depending on what step of the scroller the user is on.