|
|
Posted by X l e c t r i c on 09/19/05 20:59
To give your visitors the option of hearing the music I recommend just
displaying a player with minimum dimensions. And if you want your page
to validate then do so with a javascript, which of course won't work if
javascript is disabled.
You can put a function like this in the head:
<script type="text/javascript">
function startAudio()
{
document.write('<embed src="psychotune.mp3" autostart="false"
width="125" height="15"><\/embed>');
}
</script>
Change the width and height to your preferences.
Then in the body where you want it to appear you put:
<script type="text/javaScript">
startAudio();
</script>
or you can simply put the function in the body with a call to it:
<script type="text/javaScript">
function startAudio()
{
document.write('<embed src="psychotune.mp3" autostart="false"
width="125" height="15"><\/embed>');
}
startAudio();
</script>
You could reduce your program from three functions to one like this:
function musicOnOff()
{
var bgs_emb = document.getElementById("midi");
var bgs_but = document.getElementById("b1");
if (bgs_but.value == "Turn music on")
{
bgs_but.value = "Turn music off";
bgs_emb.play();
}
else
{
bgs_but.value = "Turn music on";
bgs_emb.stop();
}
}
(The play() and stop() will probably only work for IE and WebTV.)
Although using the DOM is the preferred way, dot notation and the forms
array still work. I haven't seen anything from a reliable source that
they are deprecated.
Then in the body:
<embed id="midi" src="psychotune.mp3" autostart="false" width="125"
height="15"></embed>
(But it won't validate)
and change your form to this:
<form action="">
<input type="button" value="Turn music on" id="b1"
onclick="musicOnOff();">
</form>
Embed your style sheet instead of using inline (or use an external css
file):
<style type="text/css">
<!--
#b1 {
background: #ffffff;
color: #000000;
font-family: Tahoma;
font-size: 7pt;
}
-->
</style>
(I'm not sure if those comments are still required for CSS.)
The bgsound shouldn't even be a consideration, as the latest versions of
the major browsers recognize embed. Using object for media would be the
best approach. But that requires a series of nested object/embed or
object/object elements to include the classid for windows media player
(and the lack of it for the other players) and the various paramater
names and values that the different players recognize.
Later, Art.
Navigation:
[Reply to this message]
|