# Video palindrome loop / negative playback rate

**URL:** https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426
**Category:** Gallery
**Created:** [May 30, 2020, 12:09pm UTC](https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426 "2020-05-30T12:09:17Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![stephanschulz](https://avatars.discourse-cdn.com/v4/letter/s/d9b06d/32.png) [@stephanschulz](https://discourse.processing.org/u/stephanschulz)
#### Post date: [May 30, 2020, 12:09pm UTC](https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426/1 "2020-05-30T12:09:17Z")

</div>

I am trying to get multiple dynamically loaded videos to loop back and forth without exhibiting a stutter when changing directions.  
Here my project example:

> **[P5js Video Palindrome](https://glitch.com/~p5js-video-palindrome)**
>
> Check out ~p5js-video-palindrome on Glitch, the friendly community where everyone can discover & create the best apps on the web.

  
In the sketch it works so so but is not very stable. Especially once build in to a larger app this method stops working.

I find almost no browser seems to work with a negative playback rate or in `p5js video.speed(-1)`  
[https://www.w3schools.com/tags/av\_prop\_playbackrate.asp](https://www.w3schools.com/tags/av_prop_playbackrate.asp)

I tried:

- forward -\> video.play() , rewind -\> video.pause() + video.time(myTime);
- video.play() + video.speed(0.01) and use video.time(myTime) with myTime increasing and decreasing
- video.speed(0) work worse than video.speed(0.01) for some reason

Has anyone found a solid solution for this?

---

<div class="post-metadata">

### Author: ![slow\_izzm](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/slow_izzm/32/5637_2.png) [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)
#### Post date: [May 30, 2020, 2:57pm UTC](https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426/2 "2020-05-30T14:57:11Z")

</div>

Here’s an example to play forward/reverse …

[https://editor.p5js.org/slow\_izzm/sketches/xs\_HCFPBa](https://editor.p5js.org/slow_izzm/sketches/xs_HCFPBa)

mp4’s are not really intended to play in reverse so it can be choppy at times.

---

<div class="post-metadata">

### Author: ![stephanschulz](https://avatars.discourse-cdn.com/v4/letter/s/d9b06d/32.png) [@stephanschulz](https://discourse.processing.org/u/stephanschulz)
#### Post date: [May 30, 2020, 3:12pm UTC](https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426/3 "2020-05-30T15:12:26Z")

</div>

Thanks for this.

In the past I encoded videos on my computer with mp4 and made sure to set it so each frame is a keyframe. that worked well enough.

But this time I tried using recordRTC to record a live camera. And I guess it does not give me the same keyframe encoding options which makes for `.webm` files that do not like rewinding.

I think I am just going to collect an array of images and cycle through them.

---

<div class="post-metadata">

### Author: ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [June 4, 2020, 7:06am UTC](https://discourse.processing.org/t/video-palindrome-loop-negative-playback-rate/21426/4 "2020-06-04T07:06:51Z")

</div>

Another option is to create a second “backwards” video file – play the forwards video, then play the “backwards” video. Twice the video to load, but each one will work naturally, and you can swap between them at the end points.