测试

mTest/room/css/liveRoom.css

@@ -1634,3 +1634,14 @@
   opacity: 0.5;
   filter: blur(0.4rem);
 }
+.play-icon {
+  display: none;
+  position: absolute;
+  width: 2rem;
+  height: 2rem;
+  top: 50%;
+  left: 50%;
+  margin-left: -1rem;
+  margin-top: -1rem;
+  z-index: 500;
+}

mTest/room/css/liveRoom.less

@@ -1688,3 +1688,14 @@
     opacity: 0.5;
     filter: blur(0.4rem);
 }
+.play-icon{
+    display: none;
+    position: absolute;
+    width: 2rem;
+    height: 2rem;
+    top: 50%;
+    left: 50%;
+    margin-left: -1rem;
+    margin-top: -1rem;
+    z-index: 500;
+}
\ No newline at end of file

mTest/room/liveRoom.html

@@ -32,7 +32,7 @@
     <script src="../lib/fsize.js"></script>
     <link rel="stylesheet" href="../css/base.css">
     <link rel="stylesheet" href="../css/layer.css">
-    <link rel="stylesheet" href="css/liveRoom.css?v=2022112201">
+    <link rel="stylesheet" href="css/liveRoom.css?v=2022112208">
     <link rel="stylesheet" href="../css/login.css?v=2022111808">
     <script src="https://accounts.google.com/gsi/client" async defer></script>
     <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
@@ -121,6 +121,7 @@
     </div>
    
     <div class="room-bg">
+        <img class="play-icon" src="../images/play-icon.png" alt="">
         <div class="touch-box"></div>
         <div  class="layer-shadow"></div>
         <div style="display: none;" class="mc-out-box">
@@ -725,7 +726,12 @@ $(function(){
      
             // flvPlay(data.pullFlowUrl)
             $("#myVideo").on("error",function(e){
-                // window.location.reload()
+                $(".play-icon").show()
+                $(".play-icon").unbind("click",function(){
+                    var myVideoEle=document.getElementById('myVideo')
+                    myVideoEle.play()
+                    $(".play-icon").fadeOut(200)
+                })
             })
 
             $("#myVideo").on("canplay",function(){