Android HTML5视频问题 [英] Android HTML5 video issue

问题描述

我正在使用HTML5视频标签在Android平板电脑上使用Android 5.0播放在线视频，但是出现了一些问题。它在iOS上运行良好。

I am using HTML5 video tag to play an online video on Samsung tablet with android 5.0, but some issues come up. And it works fine on iOS.

 <video id='video-widget' autoplay='true'  preload autobuffer controls style="width:100%;">
        <source src="{{src}}">
    </video>


.video-widget-container {
    height: 469px;
    width: 100%;
    margin-top: 100px;
}

.video-widget-container video::-webkit-media-controls-overlay-play-button
    {
    display: none;
    -webkit-appearance: none;
}

.video-widget-container video::-webkit-media-controls-panel {
    /*  display: block !important;
    -webkit-appearance:  button; */

}

.video-widget-container video::-webkit-media-controls-play-button {
    /*      display: block !important;
    -webkit-appearance:  button;  */

}

.video-widget-container.loading video::-webkit-media-controls-play-button
    {
    display: none !important;
    -webkit-appearance: none;
}

#video-widget.loading video::-webkit-media-controls-play-button {
    display: none !important;
    -webkit-appearance: none;
}

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

.video-widget-container video::-webkit-media-controls-enclosure {
    /*  display: block !important;
     -webkit-appearance:  button; */

}



.video-widget-container video {
    background: transparent url('../images/video/CVE_MAP.svg') no-repeat 0 0;
    -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
}

1. 视频无法自动播放我已设置自动播放;

1. the video does not autoplay although I have set autoplay;

有一个丑陋的大播放按钮以及我设置的海报，如图1所示，世界地图是我的海报;

there is an ugly big play button along with the poster I set, as seen in the picture1 the world map is my poster ;

推荐答案

这是海报的问题。我想如果海报没有设置在代码中。 webview将为视频标记设置默认值。所以我将海报的值设置为'null'。没关系。

It is the poster's issue. I think if the poster is not set in code. The webview would set a default one for the video tag. So I set the value of poster as 'null'. It is ok.

这篇关于Android HTML5视频问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！