menü

P

pmody

Grünschnabel
hallo...

und zwar hab ich folgendes problem.
ich möchte gern eine menüleiste machen. die einzelnen buttons sollen schon ein wenig sichtbar sein und wenn ich dann mit der maus drüberfahren, oder draufklicke, soll der einzelne button ausgefahren werden und wieder zurückfahren, sobald ich den bereich wieder verlasse.
ist das irgendwie möglich und wenn ja wie?

über hilfreiche tips würde ich mich sehr freuen.

mfg, pmody!
 
Hi,

das ist natürlich möglich, sowohl z.B. mit animierten GIFS als auch mit Ebenen (deren Position Du mit JS ändern kannst).

Du brauchst lediglich geeignete Funktionen, die beim MouseOver/MouseOut aufgerufen werden.

Eine andere Möglichkeit wäre natürlich Flash. ;)

Hier eine einfache Möglichkeit, wie man DIVs mit JS verschieben kann:
PHP: 
<script language="JavaScript" type="text/JavaScript">

var isover = new Array();
isover[1]=false;
isover[2]=false;

function butover(nr) {
	isover[nr]=true;
	moveover(nr);
}

function butout(nr) {
	isover[nr]=false;
	moveout(nr);
}

function moveover(nr) {
	if (isover[nr]) {
		b=document.getElementById("but"+nr).style;
		pos=parseInt(b.left);
		if (pos<90) {
			b.left=pos+1;
			setTimeout("moveover("+nr+")",20);
		}
	}
}

function moveout(nr) {
	if (!isover[nr]) {
		b=document.getElementById("but"+nr).style;
		pos=parseInt(b.left);
		if (pos>50) {
			b.left=pos-1;
			setTimeout("moveout("+nr+")",20);
		}
	}
}


</script>
</head>

<body>
<div id="but1" style="position:absolute; width:100; height:30; z-index:1; left: 50; top: 50; background-color: #999999; layer-background-color: #999999; border: 1px none #000000;" onMouseOver="butover(1)" onMouseOut="butout(1)">
  <div align="center">Button 1</div>
</div>

<div id="but2" style="position:absolute; width:100; height:30; z-index:2; left: 50; top: 90; background-color: #999999; layer-background-color: #999999; border: 1px none #000000;" onMouseOver="butover(2)" onMouseOut="butout(2)">
  <div align="center">Button 2</div>
</div>
</body>

Gruß
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück