We help IT Professionals succeed at work.

DreamMaster - Re: Your code.. help...

nfroio
nfroio asked
on
Hi, I am trying to use the code that you supplied me with on my site, I have edited to suit my needs, but, when I try to run it, it does not work? Can you please look and see where I may have went awry...

Thanks.

nfroio

----------------------------------------------------------

<html>
<head>
<title>Noah's German Sherpherd Dog Page</title>
<script language="javascript">
<!--
function showLayer(ALayerName)
{
if (ALayerName != "")
{
  (document.layers) ? eval("document." + ALayerName + ".visibility = 'show'") : eval("document.all['"

+ ALayerName + "'].style.visibility = 'visible'");
}
}

function hideLayer(ALayerName)
{
if (ALayerName != "")
{
  (document.layers) ? eval("document." + ALayerName + ".visibility = 'hide'") : eval("document.all['"

+ ALayerName + "'].style.visibility = 'hidden'");
}
}

function positionLayer(layerName, x, y) {

if (layerName != "") {

  (document.layers) ? eval("document." + layerName + ".top = " + y.toString() ) : eval("document.all['"

+ layerName + "'].style.top = " + y.toString() );

  (document.layers) ? eval("document." + layerName + ".left = " + x.toString() ) : eval("document.all['"

+ layerName + "'].style.left = " + x.toString() );

}

}

function collapseMenus()
{
var mnuArray = new Array();
var smnuArray = new Array();
var menulayer, multiplier
var i
mnuArray[0] = 'krychek'
smnuArray[0] = 'krycheksub'
mnuArray[1] = 'scully'
smnuArray[1] = 'scullysub'
mnuArray[2] = 'dana'
smnuArray[2] = 'danasub'
mnuArray[3] = 'neo'
smnuArray[3] = 'neosub'
mnuArray[4] = 'piper'
smnuArray[4] = 'pipersub'
mnuArray[5] = 'sckrych'
smnuArray[5] = 'sckrychsub'


for (i=0; i < mnuArray.length; i++)
{
    menulayer = (document.layers) ? document.layers[mnuArray[i]] : document.all[mnuArray[i]].style;
      menulayer.top = i * 30
}

 for (i=0; i < smnuArray.length; i++)
{
    if (smnuArray[i])
    {
         hideLayer(smnuArray[i])
    }
}
}

function showMenu(nummer)
{
var mnuArray = new Array();
var smnuArray = new Array();
var menulayer, multiplier
var i
mnuArray[0] = 'krychek'
smnuArray[0] = 'krycheksub'
var smnu0multiplier = 3
mnuArray[1] = 'scully'
smnuArray[1] = 'scullysub'
var smnu1multiplier = 5
mnuArray[2] = 'dana'
smnuArray[2] = 'danasub'
var smnu2multiplier = 4
mnuArray[3] = 'neo'
smnuArray[3] = 'neosub'
var smnu3multiplier = 4
mnuArray[4] = 'piper'
smnuArray[4] = 'pipersub'
var smnu4multiplier = 4
mnuArray[5] = 'sckrych'
smnuArray[5] = 'sckrychsub'
var smnu4multiplier = 4

for (i=0; i < mnuArray.length; i++)
{
    menulayer = (document.layers) ? document.layers[mnuArray[i]] : document.all[mnuArray[i]].style;
      menulayer.top = 50 + i * 30
}

for (i=0; i < smnuArray.length; i++)
{
  if (smnuArray[i])
  {
    if (i != nummer)
      {
         hideLayer(smnuArray[i])
      }
    else
      {
         showLayer(smnuArray[i])
      }
  }
}

for (i=0; i < mnuArray.length; i++)
{
    menulayer = (document.layers) ? document.layers[mnuArray[i]] : document.all[mnuArray[i]];
      if (i > nummer)
        (document.layers) ? menulayer.offset(0,10 * Number(eval('smnu' + nummer + 'multiplier'))) :
menulayer.style.pixelTop+=10
* Number(eval('smnu' + nummer + 'multiplier'))
}

}

//-->
</script>

<style>
<!--
BODY
{
    font-family: arial;
    font-size:12px;
    color: black;
}

#krychek
{
    position: absolute;
    left: 10px;
    top:50px;
    font-weight:bold;
    z-index:0;
}

#krycheksub
{
    position: absolute;
    left: 15px;
    top:70px;
    font-weight: bold;
    font-size:10px;
    z-index: 10;
    visibility: hidden;
}

#scully
{
    position: absolute;
    left: 10px;
    top:80px;
    font-weight:bold;
    z-index:0;
}

#scullysub
{
    position: absolute;
    left: 15px;
    top:100px;
    font-weight:bold;
    font-size:10px;
    z-index:10;
    visibility:hidden;
}

#dana
{
    position: absolute;
    left: 10px;
    top:110px;
    font-weight:bold;
    z-index:0;
}

#danasub
{
    position: absolute;
    left: 15px;
    top:130px;
    font-weight:bold;
    font-size:10px;
    z-index:10;
    visibility:hidden;
}

#neo
{
    position: absolute;
    left: 10px;
    top:140px;
    font-weight:bold;
    z-index:0;
}

#neosub
{
    position: absolute;
    left: 15px;
    top:160px;
    font-weight:bold;
    font-size:10px;
    z-index:10;
    visibility:hidden;
}

#piper
{
    position: absolute;
    left: 10px;
    top:170px;
    font-weight:bold;
    z-index:0;
}

#pipersub
{
    position: absolute;
    left: 15px;
    top:190px;
    font-weight:bold;
    font-size:10px;
    z-index:10;
    visibility:hidden;
}

#sckrych
{
    position: absolute;
    left: 10px;
    top:170px;
    font-weight:bold;
    z-index:0;
}

#sckrychsub
{
    position: absolute;
    left: 15px;
    top:190px;
    font-weight:bold;
    font-size:10px;
    z-index:10;
    visibility:hidden;
}

//-->
</style>

</head>
<body bgcolor="#FFFFFF">

<div id="krychek">
    <a href="#" onClick="showMenu(0)">Krychek</a>
</div>

<div id="krcyheksub">
    Topic<br>
    Topic2<br>
    Topic 3
</div>

<div id="scully">
    <a href="#" onClick="showMenu(1)">Scully</a>
</div>

<div id="scullysub">
    Topic<br>
    Topic2<br>
    Topic3<br>
    Topic4<br>
    Topic5
</div>

<div id="dana">
    <a href="#" onClick="showMenu(2)">Dana</a>
</div>

<div id="danasub">
    Topic<BR>
    Topic2<BR>
    Topic3<BR>
    Topic4<BR>
    Topic5
</div>

<div id="neo">
    <a href="#" onClick="showMenu(3)">Neo</a>
</div>

<div id="neosub">
    Topic<br>
    Topic2<br>
    Topic3<br>
    Topic4
</div>

<div id="piper">
    <a href="#" onClick="showMenu(4)">Piper</a>
</div>

<div id="pipersub">
    Topic<br>
    Topic2<br>
    Topic3<br>
    Topic4
</div>

<div id="sckrych">
    <a href="#" onClick="showMenu(5)">Sckrych</a>
</div>

<div id="sckrychsub">
    Topic<br>
    Topic2<br>
    Topic3<br>
    Topic4
</div>


</body>
</html>
Comment
Watch Question

Author

Commented:
dont know if you need to see it, but, in case you do:

Here is the site that I am working using until i can get this, and then transfer it to my 'real' page:

http://www.geocities.com/gsd_luver/

thanks..

Give me a while...checking it out now... :)

Max.
found it...

Your sub of krychek uses a wrong name...it says krcyheksub instead of krycheksub which it should be....

You will also need to change the multiplier of the dana submenu to 5, because it has 5 items...not 4.. :)

The rest of it looks fine... :)

Max.

P.S. Fan of dogs AND the X-Files? :) Me too!!
Oh yeah and the menu's pyper and skrych overlap each other... Change the top attribute for skrych to 200 and the sub of that to 220 :)

Max.

Author

Commented:
Cool, thanks Max, if you want to see how bad my dog fixation is, check out my current site:

http://www.geocities.com/nfroio

I will work on the code today, and let you know how it goes...

Noah
I checked it out a while before.. :)

I used to have a nest of puppies of Belgian Sheppards (when I was still living with my parents)

Max.

Author

Commented:
Thanks Max, it works great now, now, I just have to find the time to work the href's in, and toy with a wee more, and then transfer it to my main Geocities section...

Thanks again....

Noah

Author

Commented:
Hi Max,

Sorry, but, how could move the array/subs down the screen a wee bit?? eg.

I tried to adjust the top:##px, so that the heading would start 70px from top, and then, added 20 to all remaining top:###, but for some reason, it tossed everything out of alignment..

Is there somewhere in the above script that I missed that tells them where to anchor other then in the below script?


#krychek
{
   position: absolute;
   left: 10px;
   top:50px;
   font-weight:bold;
   z-index:0;
}

#krycheksub
{
   position: absolute;
   left: 15px;
   top:70px;
   font-weight: bold;
   font-size:10px;
   z-index: 10;
   visibility: hidden;
}

Do I need to remove the position: absolute, ref????

thanks.

nfroio

Author

Commented:
Hi Max,

Am I correct that I would need to change the...

{
  menulayer=(document.layers) ? document.layers[mnuArray[i]]:
document.all[mnuArray[i]].style;
menulayer.top = 50 + i * 30
}

section to read that the menulayer.top number would equal what I want the layer to start at, and then, change the numbers in the BODY section top: accordingly from where I set that number>???

Thanks,

Nfroio
Yes you are correct.. :)

Thanks for the grade A.. :)

Max.

Author

Commented:
YEAH!!!! I figured it out... whoooo - hooooo...

sorry, I get excited when concepts and understanding start to sink in...

You are very welcome for the grade, you deserved it...

thanks for confirming that what I was thinking..

Noah

Explore More ContentExplore courses, solutions, and other research materials related to this topic.