How does html5 video play automatically and use all the servers and settings on the network?

<video playsinline autoplay controls muted>
 <source src="xxx">
</video>

I found that the macOS version of the Google browser works, but the RWD Google browser doesn"t work either
safari. RWD"s safari can
RWD. I have a setting @ media screen and (max-width: 1100px) { the following is RWD
. The codes are all the same, but Google RWD doesn"t work.

Google and safari
and android built-in filters and Google processors that have not been accessed by ios

is there a great god who knows how to use all the devices and devices on behalf of others? What js code assistance do I need to add?


when the size of video is less than a certain size, modern browsers will disable video play, before user interaction occurs. If you need to play video play, you can add muted attribute to mute it. There are many similar methods on the network. related


Auto playback on PC should be compatible. The key attribute is autoplay;
, but video cannot be played automatically on mobile phone as in PC.
can add a touch listening event at most. When the whole screen is touched, it is better to play it under; (iOS, but it seems that some Android devices are not.
has tried many ways before, but it can only be done like this.
sometimes you still need to make some compromises on the demand side. If you can't do it, you just can't do it, so you have to change direction.

< hr >

Supplementary touchstart test source code is as follows:

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>TEST</title>
  <style>
  -sharpvideo{
    width: 80%;
    height: 80%;
    margin: 10% auto;
  }
  </style>
 </head>
 <body>
  <video id='video' playsinline autoplay controls muted>
    <source src="http://yun.it7090.com/video/XHLaunchAd/video01.mp4">
  </video>
  <div id='inp'></div>
  <script>
    function load (){
        document.addEventListener('touchstart',touch, false);
        document.addEventListener('touchmove',touch, false);
        document.addEventListener('touchend',touch, false);
        function touch (event){
            var event = event || window.event;
            var oInp = document.getElementById("inp");
            switch(event.type){
                case "touchstart":
                    document.getElementById("video").play();
                    oInp.innerHTML = "Touch started (" + event.touches[0].clientX + "," + event.touches[0].clientY + ")";
                    break;
                case "touchend":
                    oInp.innerHTML = "<br/>Touch end (" + event.changedTouches[0].clientX + "," + event.changedTouches[0].clientY + ")";
                    break;
                case "touchmove":
                    event.preventDefault();
                    oInp.innerHTML = "<br/>Touch moved (" + event.touches[0].clientX + "," + event.touches[0].clientY + ")";
                    break;
            }
            
        }
    }
    window.addEventListener('load',load, false);
  </script>
 </body>
</html>
Menu