Hide Native Android HTML5 Video Play Button in CSS

丶灬走出姿态 提交于 2019-12-22 00:22:18

问题


On iOS I can simply remove the play button by doing

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

However, on Android (using version 7.0) I can't remove the play button when trying the following.

video::-webkit-media-controls-overlay-play-button

video::-webkit-media-controls

video::--webkit-media-controls-play-button

Here's my video element: <video autoplay muted></video>

I could solve this natively, as shown here HTML5 video remove overlay play icon, but I'd prefer to do a CSS solution if possible.

For reference, this is what the Android play button looks like


回答1:


For anyone who comes across this question, an alternative solution to the native one is to simply not include android-webview-video-poster: in your Content Security Policy. This will block the image from ever loading in the first place. Not sure if this is considered a hackish solution, but it seems to work for me.



来源:https://stackoverflow.com/questions/44752317/hide-native-android-html5-video-play-button-in-css

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!