时间戳

首页 > 解决方案 > 用图片替换 onclick 按钮

html - 用图片替换 onclick 按钮

问题描述

如何制作以下按钮，以便有一个图像可以用作背景音乐的播放按钮？到目前为止，我有：

<audio id="player" autoplay="autoplay" loop="loop" src="file://C:\Users\Sony\Desktop\folder\cop\music\Rapsody.mp3"></audio>
  <button onclick="document.getElementById('player').play()"> Play </button> 
  <button onclick="document.getElementById('player').pause()">Pause</button> 

<audio id="player" autoplay="autoplay" loop="loop" src="file://C:\Users\Sony\Desktop\folder\cop\music\Rapsody.mp3"></audio>
  <button onclick="document.getElementById('player').play()"> Play </button> 
  <button onclick="document.getElementById('player').pause()">Pause</button>

标签： htmlbutton

解决方案

当您想用图像替换它时，您可以隐藏它并使用按钮单击它。

<audio id="player" style="display:none" autoplay="autoplay" loop="loop" src="file://C:\Users\Sony\Desktop\folder\cop\music\Rapsody.mp3"></audio>

在上面之后，您可以添加图像

<img src="x.png" onclick="$("#player").play();">

没有测试它，但我很确定这行得通

推荐阅读