Following menu [Archive] - WebDeveloper.com

mistaDave

09-05-2003, 01:44 PM

:confused:

Ok. I´ve included pretty much code in this post, but I hope you can handle it. My problem is that I have a menu that won´t follow when you scroll down. I just can´t understand what the problem is. After the code from the HTML-file you can find the code from "appearance.css" that is referenced to from the html-file. That should be all info that´s needed.

Thank you very much for any help!!

=============================
CODE FOR THE HTML-FILE
=============================
<HTML>
<HEAD>
<LINK HREF="appearance.css" REL=stylesheet TYPE="text/css">


<SCRIPT type="text/javascript">
var v, dS, sD, y, yy, object, x = 0;
function setVariables() {
if (navigator.appName == "Netscape") {
v=".top=";
dS="document.";
sD="";
y="window.pageYOffset+x";
}
else {
v=".pixelTop=";
dS="document.all.";
sD=".style";
y="document.body.scrollTop+x";
}
}
function checkLocation() {
object="iemenu";
yy=eval(y);
eval(dS+object+sD+v+y);
if(x!=320){x+=10;}
setTimeout("checkLocation()",50);
}
</script>


</HEAD>
<BODY onLoad="setVariables();checkLocation();">



<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
var IE = (document.all);
var NS = (document.layers);
var N6 = (document.getElementById) && (!document.all);
if (NS)
{document.write('<LAYER ID="nsmenu" onMouseOver="pullout()" onMouseOut="pushin()">');}
else
{document.write('<DIV ID="iemenu" onMouseOver="pullout()" onMouseOut="pushin()">');}
</SCRIPT>



<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
var menit=new Array(); var menitlnk=new Array()

menit[1] = "En enkel hemsida"
menit[2] = "Struktur"
menit[3] = "Länkar"
menit[4] = "Bilder"
menit[5] = "Textformatering"
menit[6] = "Bakgrund m.m."
menit[7] = "Tabeller"
menit[8] = "Ramar"
menit[9] = "Besöksräknare"
menit[10] = "Ljud"
menit[11] = "Tagg-index"
menit[12] = "Frågeforumet"
menit[13] = "Andra sidor"
menitlnk[1] = "intro.html"
menitlnk[2] = "grunden.html"
menitlnk[3] = "lankar.html"
menitlnk[4] = "bilder.html"
menitlnk[5] = "textformat.html"
menitlnk[6] = "sidegensk.html"
menitlnk[7] = "tabeller.html"
menitlnk[8] = "ramar.html"
menitlnk[9] = "counter.html"
menitlnk[10] = "ljud.html"
menitlnk[11] = "taggindex.html"
menitlnk[12] = "http://pub.alxnet.com/forum?id=1031321"
menitlnk[13] = "resources.html"

document.write('<TABLE CELLPADDING="0" CELLSPACING="0" width="100%"><TR><TD><A HREF="index.html"><div class="menulnk"> - Välkommen!</div></A></TD><TD BORDERCOLOR=BLACK ROWSPAN='+menit.length+'><IMG SRC="images/meny.gif" style="border-right: 1px solid white;"></TD></TR>')

for (i=1;i<=menit.length-1;i++)
if (document.URL.indexOf(menitlnk[i]) > -1) {
document.write('<TR><TD height="15"><DIV ID="welcome"> - '+menit[i]+'</DIV></TD></TR>')
} else { document.write('<TR><TD height="15"><A HREF=\"'+menitlnk[i]+'\"><div class="menulnk"> - '+menit[i]+'</div></A></TD></TR>')}
document.write('</TABLE>');
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
function regenerate() {
window.location.reload();
}

function regenerate2() {
if (NS) setTimeout("window.onresize=regenerate()",400);
}

window.onload=regenerate2;

if (IE)
{document.write('</DIV>');
slidemenu=IE.iemenu.style;
rightpos = 0;
leftpos = -120;}
else
{if (NS)
{document.write('</layer>');
slidemenu=NS.nsmenu;
rightpos = 110;
leftpos = 10;}
else
{document.write('</DIV>');
slidemenu = document.getElementById("iemenu");
rightpos = 0;
leftpos = -110;}
}

function pullout(){
if (window.push) clearInterval(push);
pullit=setInterval("startpull()",50);
}

function pushin(){
clearInterval(pullit);
push=setInterval("startpush()",50);
}

function startpull(){
if ((IE) && slidemenu.pixelLeft<rightpos)
slidemenu.pixelLeft=0;
else
if ((NS) && (slidemenu.left<rightpos))
slidemenu.left+=10;
else
if ((N6) && (slidemenu.offsetLeft<rightpos))
slidemenu.style.left=(slidemenu.offsetLeft + 10) + 'px';
else
if (window.pullit)
clearInterval(pullit);
}

function startpush(){
if ((IE) && slidemenu.pixelLeft>leftpos)
slidemenu.pixelLeft-=10;
else
if ((NS) && (slidemenu.left>leftpos))
slidemenu.left-=10;
else
if ((N6) && (slidemenu.offsetLeft>leftpos))
slidemenu.style.left=(slidemenu.offsetLeft - 10) + 'px';
else
if (window.push)
clearInterval(push);
}
</SCRIPT>

</BODY>
</HTML>

=============================
CODE FROM APPEARANCE.CSS
=============================
#welcome {
FONT-FAMILY: Verdana; FONT-SIZE:10px; FONT-WEIGHT:bold; COLOR=#9EC8E2; }
#nsmenu{
position:absolute; left: -130px; width:140px; top:10px; border:2px solid black;
background-color:WHITE; layer-background-color:white; font:bold 10px Verdana; }
#iemenu{
position:absolute; left: -119px; width:140px; top:10px; border:2px solid black;
background-color:WHITE; layer-background-color:white; font:bold 10px Verdana;
z-index: 2; }

dragle

09-08-2003, 08:54 AM

Hi mistaDave,

There are a few problems here, but the biggest one that probably has you confused is the fact that you're clobbering your onload handler--the same onload handler that's supposed to start the scroller. I.E., you have this:

<BODY onLoad="setVariables();checkLocation();">

and then later, this:

window.onload=regenerate2;

which will overwrite your onload handler as defined in the body tag. Since regenerate2 has its own browser condition, then the simplest fix is probably to drop the second assignment and use something like this for your body tag:

<BODY
onLoad="regenerate2();
setVariables();
checkLocation();">

Note that in your regenerate2 code you should also assign the function itself to the onresize, not the result of calling the function:

window.onresize=regenerate;

As I mentioned at the outset, after you get that working you'll have other problems to figure out, mostly of a cross-browser nature (Netscape won't work at all with the scroll code you posted), but this should get you going again.

Cheers,