PDA

View Full Version : image preloader/roll over



Jon101
04-19-2008, 06:07 PM
Does this look right to you?


<script 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>

I cant get these images to roll back over after you remove your mouse from them... this only happens when i use the AnyLink CSS Menu ( http://dynamicdrive.com/dynamicindex1/anylinkcss.htm )

Thanks for the help!
Jon

jscheuer1
04-20-2008, 04:46 AM
AnyLink CSS Menu overwrites existing onmouseout events (if any) for the elements that it is active on (activated by). There are many approaches one can take to overcome this depending upon just what you want to happen, and upon personal preference - as to approach (there are so many).

Here is where it (overwriting onmouseout) happens (from anylink.js - essential line highlighted red):


function dropdownmenu(obj, e, dropmenuID){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
if (typeof dropmenuobj!="undefined") //hide previous menu
dropmenuobj.style.visibility="hidden"
clearhidemenu()
if (ie5||ns6){
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5? function(){ dynamichide(event)} : function(event){ dynamichide(event)}
showhide(dropmenuobj.style, e, "visible", "hidden")
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}

If all of your anylink drop downs swap images using the code from your post, you could change that red line to:


obj.onmouseout=function(){delayhidemenu();MM_swapImgRestore();};

and it should work out. If not, or if you need more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

Nile
04-20-2008, 04:53 AM
Does this help you out, Jscheuer1:
http://www.dynamicdrive.com/forums/showthread.php?t=31596

Jon101
04-21-2008, 02:35 PM
Thanks guys, im going to check this out right now.