✔ Menüproblem

N

Nekronata

Grünschnabel
Also ich hab da noch ein Problem, welches nun die Art und weise meines (geplanten) menüs betrifft.
Eigentlich ist meine Frage recht simpel: Wie kann ich desen Code so umschreiben, das er sich auf der ein und der selben Seite, mehrmal verwenden läst:

Der relevante javaskriptteil - im Head der Page

Code: 
<style type="text/css">
<!--
#back		{position:absolute; background-color: #000000; visibility:visible;}
#master		{position:absolute; width: 200px; top: 180px; left: -220px; z-index:2; visibility:visible;}
#menu			{position:absolute; width: 118px; top: 6px; left: 210px; z-index:5; visibility:visible;}
#top			{position:absolute; width: 118px; top: 6px; left: 210px; z-index:5; visibility:visible;}
#screen		{position:absolute; width: 220px; top: 6px; left: 0px; z-index:5; visibility:visible;}
#screenlinks	{position:absolute; width: 220px; top: 6px; left: 0px; z-index:5; visibility:visible;}

.NavJump {font-family: arial; font-size: 10pt; color: #808080; text-decoration: none;}
a:link.NavJump {color : #808080;}
a:visited.NavJump {color : #808080;}
a:active.NavJump {text-decoration: none; color: #C0C0C0;}
a:hover.NavJump {text-decoration: none; color: #C0C0C0;}

-->
</style>


<script language = "javascript">
<!--

var ns6 = (document.getElementById && !document.all) ? 1 : 0
var ie = document.all ? 1 : 0
var ns = document.layers ? 1 : 0


var master = new Object("element")
master.curLeft = -120;	master.curTop = 10;
master.gapLeft = 0;		master.gapTop = 0;
master.timer = null;

function moveAlong(layerName, paceLeft, paceTop, fromLeft, fromTop){
clearTimeout(eval(layerName).timer)

if(eval(layerName).curLeft != fromLeft){
     if((Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft)) < paceLeft){eval

(layerName).curLeft = fromLeft}
else if(eval(layerName).curLeft < fromLeft){eval(layerName).curLeft = eval(layerName).curLeft + paceLeft}
else if(eval(layerName).curLeft > fromLeft){eval(layerName).curLeft = eval(layerName).curLeft - paceLeft}

if(ns6){document.getElementById(layerName).style.left = eval(layerName).curLeft}
if(ie){document.all[layerName].style.left = eval(layerName).curLeft}
if(ns){document[layerName].left = eval(layerName).curLeft}
}

if(eval(layerName).curTop != fromTop){
     if((Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop)) < paceTop){eval

(layerName).curTop = fromTop}
else if(eval(layerName).curTop < fromTop){eval(layerName).curTop = eval(layerName).curTop + paceTop}
else if(eval(layerName).curTop > fromTop){eval(layerName).curTop = eval(layerName).curTop - paceTop}

if(ns6){document.getElementById(layerName).style.top = eval(layerName).curTop}
if(ie){document.all[layerName].style.top = eval(layerName).curTop}
if(ns){document[layerName].top = eval(layerName).curTop}
}

eval(layerName).timer=setTimeout('moveAlong("'+layerName+'",'+paceLeft+','+paceTop+','+fromLeft+','+fromTop+')',30)
}

function setPace(layerName, fromLeft, fromTop, motionSpeed){
eval(layerName).gapLeft = (Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, 

fromLeft))/motionSpeed
eval(layerName).gapTop = (Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, 

fromTop))/motionSpeed

moveAlong(layerName, eval(layerName).gapLeft, eval(layerName).gapTop, fromLeft, fromTop)
}


var expandState = 0

function expand(){
if(expandState == 0){
setPace("master", 0, 10, 10); 
if(ie){document.menutop.src = "menuebar.gif"}; expandState = 1;}
else{setPace("master", -220, 10, 10); 
if(ie){document.menutop.src = "menuebar.gif"}; expandState = 0;}
}

function FixY(){
if(ns6){document.getElementById("master").style.top = window.pageYOffset+147}
if(ie){document.all.master.style.top = document.body.scrollTop+147}
if(ns){document.master.top = window.pageYOffset+147}
}

setInterval("FixY()",100);

//-->
</script>
<SCRIPT LANGUAGE=JavaScript1.1>
<!--

if (document.images) {
today=new Date();
var cGif = new Image();
cGif.src = 'http://gserv-cnet.zdnet.com/clear/1-0/' + 'TM=' + today.getTime() + '/Cnet.gif';

}
//-->
</SCRIPT>
<NOSCRIPT>
<img src=http://gserv-cnet.zdnet.com/clear/noscript/Cnet.gif border=0
height=2 width=1><br>
</NOSCRIPT>



<script language="JavaScript">

<!--


function openEmail(url,name) {
        popupWin = window.open(url,name,'scrollbars,width=400,height=600')
		self.name = "parentWin";
}

// -->

</script>

Der relevante Teil, im Body:

Code: 
<div id="master">

<div id="menu">
<table border="0" width="18" cellspacing="0" cellpadding="0">
<tr><td width="100%"><a href="javascript:expand()" target="_self" onfocus="this.blur()"
onmouseover="Bildwechsel(6, Highlight6)" onmouseout="Bildwechsel(6, Normal6)"><img name="menutop" border="0" width="20" 

height="50" src="Images/Links/button.jpg"></a>
</td></tr>
</table>
</div>
<div id="top">
</div>  
<div id="screen">
</div>
<div id="screenlinks">

<table border="0" cellpadding="0" cellspacing="0" width="209">
	<colgroup>
		<col width="13">
		<col width="196">
	</colgroup>
	<tr>
		<td></td>
		<td>
			<a href="none"
  			 onmouseover="Bildwechsel(1, Highlight1)"
  			 onmouseout="Bildwechsel(1, Normal1)"><img
                                                 src="Images/Links/home.jpg"
  			 width="196" height="50" border="0"></a><br>
			<a href="none"
  			 onmouseover="Bildwechsel(2, Highlight2)"
   		                 onmouseout="Bildwechsel(2, Normal2)"><img 
                                                 src="Images/Links/button.jpg"
  			 width="196" height="50" border="0"></a><br>
		</td>
	</tr>
</table>

</div>
</div>

Soweit funktioniert das ja auch sehr schön, zu betrachten unter http://www.deathborn-empire.de/Source/Navigation.htm

Ok, was hab ich schon alles Probiert:

Code kopieren, und die Teile screenlinks, screen, top, master und menu, mit einer zusätzlichen 2 versehen - sowohl in dem Headteil, als auch in dem Bodyteil.

Das resultat war, das es zwar 2 mal angezeigt wurde, aber funktioniert hat nur das erste, das zweite, war funktionslos.

Der Sinn, der ganzen Sache soll der sein, das das "Untermenü", nach dem klicken, über das Hauptnemü fährt, und bei erneutem klicken, wieder das darunter liegende Hauptmenü, freigibt.

Was also heist, das ich das gerne mehr als nur 2 mal einbauen will ;).
 
Hi,

das Prob wird wohl sein, dass das kopieren nicht eindeutig wird. Klar du kopierst das Object master nach master2 (oder so) - nur wird bei dem Object in der JS-Function expand() direkt der layer 'master' aufgerufen - also nicht nach master/master2 unterschieden.

Entweder änderst du den Aufruf nach expand('layername') und entsprechend in der JS-Function, oder du kuckst mal unter http://www.dynamicdrive.com/dynamicindex1/index.html - ob du da was passendens findest.

Ich meine, dass war nur eine Sache die mir auffiel, ob es dann geht .. kuck mal *gg*

Dirk
 
Mmhh, hab jetzt mit einem Kumpel noch mehr versucht (auch das hier, thx), hat aber irgendwie alles nichts geholfen, auser, das ein paar komische effekte zustande kammen LOL.

Naja, werde das dann wohl lieber mit flash machen.

Aber danke für die Antwort
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück