将音频播放器添加到点击按钮

问题描述 投票:0回答:0

我创建了一个具有 onclick 功能的按钮,可以在单击后更改页面的背景。我想将 Spotify(如果可能)或 Youtube 的播放列表添加到按钮,以便在您按下按钮后播放音乐。

我尝试使用功能播放并尝试链接 Youtube 视频和 Spotify 播放列表,但都没有用。

<!DOCTYPE html>
<html>
<meta name= "viewport" content="width=device-width, intial-scale=1"/>
    <head>
        <title>Music Room</title>   
        <h1>Music Room</h1>        
    </head>
    <body>
<!---SOUNDS-->
<button class="cafe"    onclick="cafe()"    id="cafe"></button>

</body>
</html>

/*Cafe*/
.cafe {
    position: relative;
    display: block;
    margin: -500px 100px 0px 500px;
    width: 100px;
    height: 100px;
    line-height: 300px; 
    border: 2px solid #705009;
    border-radius: 50%;
    text-align: center;
    text-decoration: none;
    background-color: #e2a115b6;
    font-size: medium;
    font-weight: lighter;
}


.cafe:hover{
    background-image: radial-gradient(rgb(255, 215, 154) 0%,rgb(209, 155, 84)100%, rgb(201, 137, 54) 50%);
    cursor: pointer;
}

/*Cafe*/
function cafe(){
    document.body.style.backgroundColor="#da8e44"
}
audio onclick spotify audio-player
© www.soinside.com 2019 - 2024. All rights reserved.