如何製作單擊播放音頻的圖像

-1

我正在嘗試實現播放音頻的按鈕。我不想擁有滑塊。如何製作單擊播放音頻的圖像

無論如何擺脫滑塊，或者也許使用按鈕的圖像呢？

當前代碼：

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Music</title> 
<style type="text/css"> 
body { 
     color:transparent; 
} 
</style> 
</head> 

<body onLoad="RandomSong();"> 
<audio id="content" src="background1.mp3" controls></audio> 

<script> 
function RandomSong() { 
    var Music = ["background1.mp3","background2.mp3","background3.mp3","background4.mp3","background5.mp3"]; 
    var randomCode = Math.floor(Math.random()*Music.length); 
    document.getElementById("content").value = "mp3=" + Music[randomCode] + "&amp;showslider=0&amp;width=5&amp;loop=1&amp;autoplay=0&amp;volume=50"; 
} 
</script> 
</body> 
</html>

來源

2015-10-18 DaFudgeWizzad

你有什麼代碼，使遠嗎？ –

我已經嘗試了很多東西，我甚至已經得到了圖像顯示。我只需要它在循環播放聲音 – DaFudgeWizzad

http://pastebin.com/2c4wSuqZ 我有音頻工作，無論如何，我可以用一個圖像替換播放器？更妙的是，無論如何，我可以隱藏滑塊，只有播放按鈕可見？ – DaFudgeWizzad

有一個簡單的jQuery解決這個：

<script type="text/javascript" src="jquery-1.7.1.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$('#track1').click(function(){ 
    $('#wrap').append('<embed id="embed_player" src="audio.wav" autostart="true" hidden="true"></embed>'); 
}); 
}); 
</script> 
<img name="track1" src="images/track1.png" width="180" height="180" border="0" id="track1" alt="" /> 
<div id="wrap">&nbsp;</div>

源：Play sound file when image is clicked

來源

2015-10-18 22:03:44 CodeLyfe

我：從@blasteralfred看看這個類似的帖子一個答案爲孩子們製作文字遊戲，我一直在玩這個代碼，如何製作一個可以播放音頻的圖像。我希望這將幫助你我使用記事本+ +此代碼的工作在谷歌丁目

<!DOCTYPE html> 
<html> 
<script> 
var audio1 = new Audio("/Sound 1/Samples 1Sounds/CAT.wav "); 
audio.oncanplaythrough = function(){} 
audio.onended = function(){} 
</script> 

<input type="image"  id="myimage"style="height:200px;width:200px;"src="/Picture 1/Samples  Pictures/cat.jpg" 
onclick="audio1.play()"> 

<script> 
var audio2 = new Audio("/Sound 1/Samples 1Sounds/dog.wav "); 
audio.oncanplaythrough = function(){} 
audio.onended = function(){} 
</script> 

<input type="image" id="myimage"  style="height:200px;width:200px;"src="/Picture 1/Samples Pictures/dog.jpg" 
onclick="audio2.play()"> 
</html>

來源

2016-12-05 02:38:41

如何製作單擊播放音頻的圖像

回答

相關問題