Using In JavaScript
<script src="https://cdn.jsdelivr.net/gh/MASTER0811/play-pause-button/main.js"></script>
git clone https://github.com/MASTER0811/play-pause-button.git
- Only Using This Element
<music-btn>
Exp:
<!-- You must add "play" text -->
<music-btn>Play</music-btn>
- Add
<script>
tag in your<body>
Element - Add a function
musicmode()
Exp:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exp File</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/gh/MASTER0811/play-pause-button/main.js"></script>
<script>
musicmode()
</script>
</body>
</html>
Exp:
musicmode("./music.mp3")
Exp:
musicmode("./music.mp3", 0.5)
Exp:
musicmode("./music.mp3", 0.5, true)
Notice: If you don't want let music loop, you can without any text.
You can design using .style
class
Exp:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');
music-btn.style{
padding: 10px 30px;
background: lightblue;
font-size: 18px;
font-family: 'Poppins',sans-serif;
font-weight: bold;
}