1

In my app I have a video playing in background of a Div.
Everything works as expected if application running on iPad iOS 9.
But on iPad iOS 10, I see video is getting played in the video player and until I stop video using Done button my overlay div is not visible.

My question is how to overlay Div on top of Video using CSS, HTML and JavaScript.

Currently I am displaying div in below way: 

<div>
    <video id="myVideo" 
           width="100%" height="100%" 
           preload="true" 
           autoplay="true"
           loop="loop"
           >
        <source src="video/myVideo.m4v" type="video/mp4" />
        Your browser does not support the video tag.
    </video>
</div>

<div class="video-overlay-style" >
    This Div is Overlay 
</div>

Issue That I am Facing:
On iPad iOS 9 every thing works as expected and I can see video playing in background of the Div.
But on iPad with iOS 10, When I open my page, I first get the video play window with all the video controls and then it keeps playing video in loop playing in loop is ok) and when I stop the video using Done button then I see my overlay div, but I want to overlay my Div on the top of video.

User7723337
  • 11,857
  • 27
  • 101
  • 182
  • It's unclear what's your issue exactly - that your video is auto-played? That's obviously due to `autoplay` attribute. – hindmost Nov 28 '16 at 09:41
  • @hindmost : Please see my updated question. on iPad iOS 10 my video is not playing in background of the overlay Div. my overlay div is not visible till I stop the video. When video is stopped then only my Div is visible. But I want to have video playing in background and overlay Div on that playing video. – User7723337 Nov 28 '16 at 09:59
  • @A_user Need the CSS especially the rulesets for `.video-overlay-style`. and if there's any JavaScript or jQuery. – zer00ne Nov 28 '16 at 10:38

0 Answers0