mostrando video html5 en ios sin superposition de button de reproducción

Estoy intentando mostrar una image que cuando se hace clic abrirá un reproductor de video en html 5, pero no quiero que el pequeño button de reproducción semitransparente aparezca encima. ¿Hay alguna manera de especificar en la label que no se coloque ese ícono sobre la image del cartel y simplemente se muestre la image del cartel tal cual?

Por lo que yo sé, la superposition del button de reproducción es agregada por el motor de renderizado en el Safari mobile, por lo que no hay forma de ocultarlo. Sin embargo, es posible que pueda falsearlo usando ajax para cargar el video cuando se hace clic en una image estática. Por ejemplo:

Html

<div id="videoContainer"> </div> 

CSS

 #videoContainer { background-image: url(http://placehold.it/60x40.png); height: 40px; width: 60px; } 

JavaScript

 $("#videoContainer").click(function() { $(this).css('background', 'none').parent().html("<video id=\"video\" width=\"60\" height=\"40\">\n" + "<source src=\"video.mp4\" type=\"video/mp4\">\n" + "<source src=\"video.ogg\" type=\"video/ogg\">\n" + "</video>"); $("#video").get(0).play(); }); 

Puede ocultar el button de reproducción de superposition en el iPhone con solo algunos CSS:

 video::-webkit-media-controls-start-playback-button { display: none; } 

Deberías probar esto

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