[RESOLVED] Rollover problem not yet resolved

[alexweb]

Hello I have an issue with a rollover on my page. I'm building a website for AS level media coursework and need help with a code. The rollover is part of a table and is aimed to play music when the mouse hovers over it, while at the same time switching the image to another...

The code for the rollover itself is:
<a href="#" onMouseOut="MM_swapImgRestore()""stopSound(0);" onMouseOver="MM_swapImage('Image9','','piece1.jpg',1)""playSound(0);"><img src="piece1hit.jpg" name="Image9" width="156" height="156" border="0"></a>

The bad javascript for the image swap is:
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

And finally the even worse coding for the sound is:
<SCRIPT LANGUAGE="JavaScript"><!--


var aySound = new Array();

aySound[0] = "Kylie.mp3";
aySound[1] = "fseven.mp3";


IE = (navigator.appVersion.indexOf("MSIE")!=-1 && document.all)? 1:0;
NS = (navigator.appName=="Netscape" && navigator.plugins["LiveAudio"])? 1:0;
ver4 = IE||NS? 1:0;
onload=auPreload;

function auPreload() {
if (!ver4) return;
if (NS) auEmb = new Layer(0,window);
else {
Str = "<DIV ID='auEmb' STYLE='position:absolute;'></DIV>";
document.body.insertAdjacentHTML("BeforeEnd",Str);
}
var Str = '';
for (i=0;i<aySound.length;i++)
Str += "<EMBED SRC='"+aySound[i]+"' AUTOSTART='FALSE' HIDDEN='TRUE'>"
if (IE) auEmb.innerHTML = Str;
else {
auEmb.document.open();
auEmb.document.write(Str);
auEmb.document.close();
}
auCon = IE? document.all.auIEContainer:auEmb;
auCon.control = auCtrl;
}
function auCtrl(whSound,play) {
if (IE) this.src = play? aySound[whSound]:'';
else eval("this.document.embeds[whSound]." + (play? "play()":"stop()"))
}
function playSound(whSound) { if (window.auCon) auCon.control(whSound,true); }
function stopSound(whSound) { if (window.auCon) auCon.control(whSound,false); }
//--></SCRIPT>

I hope someone can resolve my issue for me, for I'm absolutely stumpted by this. I have very limited expertise in coding (as you can see) and would greatly appreciate any help I can recieve.
Thank you for your time.

[Dirk Lance]

what about:

<a href="#" onMouseOut="MM_swapImgRestore();stopSound(0);" onMouseOver="MM_swapImage('Image9','','piece1.jpg',1);playSound(0);"><img src="piece1hit.jpg" name="Image9" width="156" height="156" border="0"></a>

[Dirk Lance]

also if you've got scrolling content you might want to change your:

<a href="#"
to
<a href="javascript:void(0);"

that will keep the page from 'hopping' after the click.

[alexweb]

Wow, man! That worked perfectly!
Thank you so much, that was really helpful advice!
I really, really appreciate that!
x

[Dirk Lance]

no prob dude, glad to help.

its a general rule when firing off js functions inline like that to use semi-colons b/t the functions.

<a href="javascript:void(0);" onclick="function1();function2();">poo</a>

Also, please mark as resolved to keep this place clean. thanks!

[Clueful]

also if you've got scrolling content you might want to change your:

<a href="#"
to
<a href="javascript:void(0);"

that will keep the page from 'hopping' after the click.
That is called the javascript pseudo protocol, and you can Google it to learn why it should never be used in a link, no matter how often you see it done.
To avoid a link with href='#' from jumping to the top, just return false from the onclick handler:

<a href="#" onclick="function1();function2();return false">GO</a>

[Dirk Lance]

WOW. been using that far tooo long.

heres a decent link explaining:
http://blog.reindel.com/2006/08/11/a-hrefjavascriptvoid0-avoid-the-void/

thanks Clueful.