Video opens new screen with controls on a mobile device; how can I avoid this?

Question

I made a video player with html, css and JavaScript, made my own buttons to play, pause etc. This works fine on the computer but on a mobile device the video opens a new screen with automatic controls and the whole idea of my design is lost.
Is there a way to avoid this, so that the video stays in the designated box and my customized buttons stay visible?
I’ll insert my code below, so you can see what I mean...
https://code.sololearn.com/W2flz2jGqrKI/?ref=app

Answer 1

It seems to work fine on my device.
Very Nice UI concept.

Answer 2

Niush sitaula What device do you use? Maybe it does only work on a tablet? On my iPhone the screen will fill up with the video and the automatic controls...

Answer 3

Nope, not a tablet. I have Android Lollipop and plays in both PC and Android as expected.

Answer 4

Niush sitaula oh wow, that’s great to hear! Maybe it’s just an iPhone problem... 🤨 Thanks for checking this for me 🙏