To start off, perhaps my description of this problem will make more sense if you look at the webpage in question:
<!-- m --><a class="postlink" href="http://lapsuslinguae.co.uk/home.htm">http://lapsuslinguae.co.uk/home.htm</a><!-- m -->
The goats which glow with disney like radiance are the image maps, the layer is on the bottom right. (Don't ask me why there's goats there)
I'm encountering poor performance of a Javascript Show/Hide DHTML Element function on a graphically intensive webpage (Animated GIFS).
On an image map's mouseover event, I wish certain layer's visibility to change. The layers contain nothing more than text (descriptions of each link).
I have tried various different functions all of which still cause up to a second delay in the animated GIFs - a delay which I find unacceptable as they defeat the purpose of the page.
If I instead try to carry across the information using the Alt attribute of the mage maps, then there is no delay and the popup hint displays the informtaion fine. However, I specifically want the information to appear in a particular area of the page, and I find the asthetic qualities of various browsers alt popups almost non-existant.
Maybe I'm approaching this entirely the wrong way - I have considered ditching the idea of changing layers visibility; to instead change the inner html content of one layer. However this also caused a short delay - affecting the fluency of the gifs.
Should I ditch all of this: design the page in flash, detect the users flash capabilities and redirect non compliant browsers to the origonal page with delayed layer visibility changes, or should I carry on searching for code that is capable of perforing this task effectively?
These are the functions called from each image map:
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[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible'
v=='hide')?'hidden':v; }
obj.visibility=v; }
}
And this is an example of an image map which changes visibility of layers:
<map name="bio_Map">
<area shape="rect" coords="-1,0,32,35" href=http://www.webdeveloper.com/forum/archive/index.php/"bio.htm" alt="" onMouseOver="MM_showHideLayers('bio','','show','destiny','','hide')"
onMouseOut="MM_showHideLayers('bio','','hide','destiny','','show')">
</map>
I do recommend looking at the webpage though: <!-- m --><a class="postlink" href="http://lapsuslinguae.co.uk/home.htm">http://lapsuslinguae.co.uk/home.htm</a><!-- m -->
Hope to hear some ideas from you.
thanks
Alasdair
<!-- m --><a class="postlink" href="http://lapsuslinguae.co.uk/home.htm">http://lapsuslinguae.co.uk/home.htm</a><!-- m -->
The goats which glow with disney like radiance are the image maps, the layer is on the bottom right. (Don't ask me why there's goats there)
I'm encountering poor performance of a Javascript Show/Hide DHTML Element function on a graphically intensive webpage (Animated GIFS).
On an image map's mouseover event, I wish certain layer's visibility to change. The layers contain nothing more than text (descriptions of each link).
I have tried various different functions all of which still cause up to a second delay in the animated GIFs - a delay which I find unacceptable as they defeat the purpose of the page.
If I instead try to carry across the information using the Alt attribute of the mage maps, then there is no delay and the popup hint displays the informtaion fine. However, I specifically want the information to appear in a particular area of the page, and I find the asthetic qualities of various browsers alt popups almost non-existant.
Maybe I'm approaching this entirely the wrong way - I have considered ditching the idea of changing layers visibility; to instead change the inner html content of one layer. However this also caused a short delay - affecting the fluency of the gifs.
Should I ditch all of this: design the page in flash, detect the users flash capabilities and redirect non compliant browsers to the origonal page with delayed layer visibility changes, or should I carry on searching for code that is capable of perforing this task effectively?
These are the functions called from each image map:
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[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible'
v=='hide')?'hidden':v; }obj.visibility=v; }
}
And this is an example of an image map which changes visibility of layers:
<map name="bio_Map">
<area shape="rect" coords="-1,0,32,35" href=http://www.webdeveloper.com/forum/archive/index.php/"bio.htm" alt="" onMouseOver="MM_showHideLayers('bio','','show','destiny','','hide')"
onMouseOut="MM_showHideLayers('bio','','hide','destiny','','show')">
</map>
I do recommend looking at the webpage though: <!-- m --><a class="postlink" href="http://lapsuslinguae.co.uk/home.htm">http://lapsuslinguae.co.uk/home.htm</a><!-- m -->
Hope to hear some ideas from you.
thanks
Alasdair