How to hide the controls of the html5 video tag with ios/iphone devices on webkit/cordova/phonegap? [duplicate]

Question

This question already has answers here:

Hide iPhone HTML5 video play button (16 answers)

Closed 7 years ago.

The controls are always visible, no matter the state of the "controls" flag (whether it's there or not) and the video tag itself emits the touch events with the controls on

Answer 1

Omitting the "controls" flag should render the video tag control-less, however a temporary bug or not, the flag is completely ignored at iphone/ipod devices, the controls are also meaningless, as the video always plays in full-screen, you are left with a huge chunk of space, whose only purpose is to suck all the click and touch events like a black hole

The behavior is documented here: https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html

The solution is to set the video tag's width/height to 1/1 - position it with "fixed" to -10,-10 and manually trigger "play" with a replacement UI instead of an actual video

This way the absurdities of the video tag are gone and since it always plays in fullscreen, the functionality is the same