WiMu
05-30-2008, 09:05 AM
1) CODE TITLE: Simple musicplayer
2) AUTHOR NAME/NOTES: WiMu
3) DESCRIPTION: Simply play and stop music by clicking on play- and stop-buttons
4) INFO: I needed a really simple musicplayer that goes without Quicktime, Windows Media Player, Flash, etc. So after I didn't find one in the internet, I wrote my own (note: I'm totaly new to Javascript and coding in general, but it works fine with FF2 and IE7). In the following example I use a folder called "media" with all my sound files (e.g. music1.wav & music2.wav) and two images play.gif and stop.gif as player buttons (both in a folder called "images"):
.js:
function Play (file) {
var path = '<embed src="media/' + file + '.wav" autostart="true" loop="false" hidden="true" height="0" width="0">';
document.getElementById (file).innerHTML = path + '<img src="images/stop.gif" style="cursor:pointer;" onclick="Stop(' + "'" + file + "'" + ')">';
}
function Stop (file) {
document.getElementById (file).innerHTML = '<img src="images/play.gif" style="cursor:pointer;" onclick="Play(' + "'" + file + "'" + ')">';
}
.html:
<div id="music1"><img src="images/play.gif" style="cursor:pointer;" onclick="Play('music1')"></div>
<div id="music2"><img src="images/play.gif" style="cursor:pointer;" onclick="Play('music2')"></div>
I hardcoded as much as possible (like ".wav") for easier use, so this tiny script is not very flexible. However, feel free to use it and/or work it over.
Greetings,
WiMu (http://kamelopedia.mormo.org/index.php/Kamel:WiMu)
P.S.: sorry for my lack of English
2) AUTHOR NAME/NOTES: WiMu
3) DESCRIPTION: Simply play and stop music by clicking on play- and stop-buttons
4) INFO: I needed a really simple musicplayer that goes without Quicktime, Windows Media Player, Flash, etc. So after I didn't find one in the internet, I wrote my own (note: I'm totaly new to Javascript and coding in general, but it works fine with FF2 and IE7). In the following example I use a folder called "media" with all my sound files (e.g. music1.wav & music2.wav) and two images play.gif and stop.gif as player buttons (both in a folder called "images"):
.js:
function Play (file) {
var path = '<embed src="media/' + file + '.wav" autostart="true" loop="false" hidden="true" height="0" width="0">';
document.getElementById (file).innerHTML = path + '<img src="images/stop.gif" style="cursor:pointer;" onclick="Stop(' + "'" + file + "'" + ')">';
}
function Stop (file) {
document.getElementById (file).innerHTML = '<img src="images/play.gif" style="cursor:pointer;" onclick="Play(' + "'" + file + "'" + ')">';
}
.html:
<div id="music1"><img src="images/play.gif" style="cursor:pointer;" onclick="Play('music1')"></div>
<div id="music2"><img src="images/play.gif" style="cursor:pointer;" onclick="Play('music2')"></div>
I hardcoded as much as possible (like ".wav") for easier use, so this tiny script is not very flexible. However, feel free to use it and/or work it over.
Greetings,
WiMu (http://kamelopedia.mormo.org/index.php/Kamel:WiMu)
P.S.: sorry for my lack of English