Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

Video/Html/iOS

Avatar

Level 3

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

Avatar

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;
}