[javascript] image ipv selectbox

[JVaags]

Hoi,

het volgende. Ik heb een muziekje gemixed voor als achtergrond muziek op mijn website. Nu zou ik het zo willen hebben dat je deze aan en uit kunt zetten. Ik heb het volgende script ergens vandaan getoverd.

code:

<script>
musi="./sound/bg_superstring.mp3"

function mus1()
{
if (t.options.selectedIndex==0){mus.innerHTML="<embed src="+musi+" loop=-1>"
}
if (t.options.selectedIndex==1){mus.innerHTML=""
}
}
document.write("<span id='mus' style='position:absolute;top:-90000'><embed 
src="+musi+" width=0 height=0 loop=-1></span>")
</script>

<select name="t" onchange=mus1()>
<option>Aan
<option>Uit
</select>

En dat werkt.

Zoals je ziet wordt de muziek geregeld via een selectbox met daarin aan of uit. Ik zou dit echter graag via 2 plaatjes met daarachter een link willen aansturen. Een play knopje en een stop knopje dus.

Ik krijg dat echter niet voor elkaar

Wat voor (javascript) link moet ik opgeven bij het plaatje om de waarde van "t" te laten veranderen (dat is volgens mij nodig om de muziek aan en uit te krijgen)

[André]

Even een kant en klare oplossing:

HTML:

<script type="text/javascript">
musi="./sound/bg_superstring.mp3"

function Aan()
{
  mus.innerHTML = "<embed src='" + musi + "' loop='-1'>";
}

function Uit()
{
  mus.innerHTML = "";
}

document.write("<span id='mus' style='position:absolute;top:-90000'><embed 
src='" + musi + "' loop='-1'></span>")
</script>

[img]"aan.gif">
<img[/img]

[ Voor 32% gewijzigd door André op 28-03-2004 00:07 ]

[Erkens]

beetje offtopic hoor, maar waarom 2x in je js die embed zetten?
gewoon die span writen en daarna die functie Aan() aanroepen lijkt me handiger als je iets aan die tag wilt veranderen
en helemaal als je misschien met een cookie ofzo wilt bijhouden of muziek aan of uit moet, dan opent je page niet automatisch met geluid
/idee

edit:

André (hieronder):

[ Voor 35% gewijzigd door Erkens op 28-03-2004 00:34 ]

[André]

Speciaal voor Erkens:

HTML:

<script type="text/javascript">
musi="./sound/bg_superstring.mp3"

function Aan()
{
  mus.innerHTML = "<embed src='" + musi + "' loop='-1'>";
}

function Uit()
{
  mus.innerHTML = "";
}

window.onload = Aan;
</script>

<span id='mus' style='position:absolute;top:-90000'></span>
[img]"aan.gif">
<img[/img]

[crisp]

waarom op zo'n ranzige manier?

HTML:

<object id="muziek" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
  type="application/x-oleobject" height="0" width="0" style="visibility:hidden">
  <param name="filename" value="./sound/bg_superstring.mp3">
  <param name="autostart" value="false">
  <param name="loop" value="false">
</object>
<img src="aan.gif" onclick="document.getElementById('muziek').Play()" alt="" />
<img src="uit.gif" onclick="document.getElementById('muziek').Stop()" alt="" />

voor crossbrowser compatibility moet je iets met mimetype sniffing gaan doen, of kijken welke plugin voorhanden is en dan de juiste object tag schrijven. Embed is echt zwaar verouderd...

[JVaags]

Kijk en dan zie ik nu direct waarom het bij mij gister niet werkte.
Zoals ik de functie had opgesplitst werkte het niet en ik had de verkeerde opdracht bij het knopje

Het laatste voorstel van André staat inmiddels op mijn site en dat werkt

De oplossing van Crisp middels een object werkt bij mij niet. Ik zal hoogstwaarschijnlijk wel iets verkeerd doen...