Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Video/Html/iOS

Sophie_HH
Level 2
Level 2

Hi all,

Is there a way to force the video to play in a dedicated space in my page instead of having it automatically play full screen?

At the moment, when I press Play it launches itself full screen but my client wants it to stay in a small space so users can still view the content below the video. If I try to reduce the video, it stops playing.

Here is the code for my video:

<video width="955" height="540" id="crisis-vid" title="XXXXX" poster="img/video-poster.png" controls >

                <source src="img/xxx-v3.mp4" type="video/mp4" />

                <p>XXX</p>

              </video>

I have some css in it but it's only positioning and sizing in.

Also, iOS is automaticcaly placing a "Play" button on top of video. Is there a way to remove it?

Thank you,

Sophie

1 Reply
jerwarren
Level 2
Level 2

On iPhone, videos always play full screen.  On iPad, however, you can get them to play inline.  This is an iOS limitation, not a DPS limitation.

If you want to hide the play button, you can do something fancy with your css like this:

video::-webkit-media-controls {
  display
:none !important;
}