CODEWITHSUNDEEP
jqueryhtml
Akash Nevagi
Akash Nevagi

Reputation: 89

How to auto play video in html5

my inedx.html is started by playing full-screen video, when the video ends the button will appear on the screen by clicking the button it will redirect to another page, but my problem is when I use "autoplay muted" property audio is muted i want to play video along with audio how to achieve this.

$(document).ready(function() {
  // Hide the div
  $(".btn").hide();
  // Show the div after 5s
  $(".btn").delay(1000).fadeIn(1000);
});

function ak() {
  window.location.href = "indexpree.html";
}
* {
  padding: 0%;
  margin: 0%
}

body {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.outerConatiner {
  position: relative;
  height: 100%;
  width: 100%;
}

.btn {
  position: absolute;
  width: 500px;
  height: 90px;
  top: 800px;
  left: 680px;
  z-index: 1000;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>

<head>
  <title>
  </title>
</head>

<body>

  <div class="outerConatiner">
    <video autoplay muted>
                    <source src="./Intro.webm" type="video/webm">
                    Your browser does not support HTML5 video.
                    </video>

    <img class="btn" src="./Enter Button.png" onclick="ak()">

  </div>

</body>

</html>

Upvotes: 0

Views: 104

Answers (1)

Hari Krishnan K R
Hari Krishnan K R

Reputation: 93

As per the google's updated autoplay polices back in 2018

Autoplay with sound is allowed only if :

  • User has interacted with the page (click, tap, etc.)
  • On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously play video with sound.
  • On mobile, the user has [added the site to their home screen].

Upvotes: 1

Related Questions