3D FlipBook - Multiple videos in the same pdf

s***n@gmail.com

2021-02-18

2021-02-19

I am using this code to size and position an animation in my document and it is working fine on the first page.

CSS:
.video1 {
width: 895px;
height: 504px;
position: absolute;
left: 67px;
top: 30px;
}

HTML:
<video class="video1 play-on-shown pause-on-hide"
src="http://artpocalypse.com/wp-content/uploads/2021/02/LEATHER_BW.mov"></video>

I need to put a different video of the same size in the same position on multiple pages. I thought I could just add video2/3/4 and change the sources. Only the example on the first page works.

I am not a coder, could someone please advise a solution? What am I doing wrong?

Thanks.

Replies

a***r@3dflipbook.net

2021-02-19

use

Page 1:

CSS:
.position-1 {
width: 895px;
height: 504px;
position: absolute;
left: 67px;
top: 30px;
}
.position-2 {
width: 200px;
height: 200px;
position: absolute;
left: 100px;
top: 100px;
}

Any other page:

HTML:
<video class="position-1 play-on-shown pause-on-hide"
src="http://example.com/video.mp4"></video>
or
<video class="position-2 play-on-shown pause-on-hide"
src="http://example.com/video.mp4"></video>

s***n@gmail.com

2021-02-19

This worked perfectly! thanks so much for your help.

s***r@gmail.com

2021-02-27

2 videos on same page?

a***r@3dflipbook.net

2021-03-03

2 videos on the same page:

css:
.vid {
  position: absolute;
}
html:
<div class="vid youtube play-on-shown pause-on-hide" data-id="fQOuO6w9CR0" style="width: 400px;height: 300px;top: 100px;left: 100px;"></div>
<div class="vid youtube play-on-shown pause-on-hide" data-id="COueCeQpeB4" style="width: 400px;height: 300px;top: 500px;left: 100px;"></div>