HTML 5 video shows up as a blank white screen in Android

Sounds like this might possibly be an HTML structure problem (HTML syntax errors).

Post the URL of your problem page for testing.

Or you can use https://validator.w3.org/nu/ to do your own testing.

You're looking for output report to be "Document checking completed. No errors or warnings to show."

There may be other problems. This is the first to check + fix.

Be aware the video probably won't auto start on mobile device.

You may need to add different video format mp4, avi, ogv, ogg ...
and you should use poster so in case the video does not display it will display at least an image

<video width="620" controls
  poster="https://upload.wikimedia.org/wikipedia/commons/e/e8/Elephants_Dream_s5_both.jpg" >
  <source
    src="https://archive.org/download/ElephantsDream/ed_1024_512kb.mp4"
    type="video/mp4">
  <source
    src="https://archive.org/download/ElephantsDream/ed_hd.ogv"
    type="video/ogg">
  <source
    src="https://archive.org/download/ElephantsDream/ed_hd.avi"
    type="video/avi">
  Your browser doesn't support HTML5 video tag.
</video>

Select allOpen in new window

Ref: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video

To expand on lenamtl's comment...

Keep in mind, all recent browsers have disabled video + audio autostart.

To accomplish this, you'll have to use a Javascript snippet to fire off a fake start event.

Post your URL for best answers.

Thanks to both of you. I tried that code but videos not loads on Android Mobile in Chrome. But it shows poster image.

The problem is because it set to be hidden on small device just remove this from your slider class hidden-xs hidden-sm

<div class="slider-video hidden-xs hidden-sm">

Select allOpen in new window

to

<div class="slider-video">

Select allOpen in new window

Reference: https://getbootstrap.com/docs/3.3/css/#responsive-utilities-classes

if i remove those classes then video will videos will show 2 times. This check is applied so that responsive videos will not show in desktop.

Ok then just keep one DIV that show for all devices..

<div class="slider-video">

Select allOpen in new window

or rethink the logical using the helper class
https://getbootstrap.com/docs/3.3/css/#responsive-utilities-classes

You can use the visible or hidden class I do prefer to use the visible class as there is less pitfall to my opinion