I've been grappling with a website that features a loading page lasting 5 seconds, during which users can choose to activate autoplay or not. However, even after implementing a condition in my code, the autoplay feature continues to run unexpectedly. Here's the code snippet - I hope someone can provide some assistance.
body .loading {
text-align: center;
}
body #content {
display: none;
}<!doctype html>
<html lang=en>
<head>
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<div class="loading">
<input type="button" value="Click Here to mute" class="autoplay" id="autoplayno" />
</div>
<div id="content">
<iframe class="embed-responsive-item" id="iframesc" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/users/334742776&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true&start_track=1"
allow="autoplay"></iframe>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<!--Loading Page-->
<script>
$(".loading").fadeOut(5000, function() {
$("#content").fadeIn(2000);
});
</script>
<!--The script which is not working-->
<script>
var hasBeenClicked = false;
$("#autoplayno").click(function() {
hasBeenClicked = true;
});
if (hasBeenClicked) {
$("#iframesc").attr("src", "https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/users/334742776&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true&start_track=1");
$("#autoplayno").attr("value", "Sound mutted");
} else {
window.setTimeout(function() {
$("#iframesc").attr("src", "https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/users/334742776&color=%23ff5500&auto_play=true&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true&visual=true&start_track=1")
}, 4000)
}
</script>
</html>