Hallo Leute,
Ich habe folgendes Problem:
Ich will ein Javscript Menü machen, dass vertikal an der linken Seite des Bildschirms ist. Wenn man nun auf einen Menüeintrag klickt schieben sich untendrunter Tabellen ein.
Ich hbe dies so realiesiert das ich die Tabellen verkleinere und vergrößere.
Jedoch bleibt, wenn ich die Tabellen minimiere ein kleiner Rahmen. Derdorteigentlich nicht sein sollte. Wie knn ich lso die Tabelle 100% "klein kriegen".
MFG RopeMaker
Ich habe folgendes Problem:
Ich will ein Javscript Menü machen, dass vertikal an der linken Seite des Bildschirms ist. Wenn man nun auf einen Menüeintrag klickt schieben sich untendrunter Tabellen ein.
Ich hbe dies so realiesiert das ich die Tabellen verkleinere und vergrößere.
Jedoch bleibt, wenn ich die Tabellen minimiere ein kleiner Rahmen. Derdorteigentlich nicht sein sollte. Wie knn ich lso die Tabelle 100% "klein kriegen".
MFG RopeMaker
Code:
<html>
<head><title>Menü</title>
<script type="text\javascript">
function mon(idtd)
{
document.getElementById(idtd).bgColor='#FF0000';
}
function mout(idtd)
{
document.getElementById(idtd).bgColor='#999999';
}
function display(mode,tree){
if(mode=='s'){
document.getElementById(tree).style.visibility='visible';
}else{
document.getElementById(tree).style.visibility='hidden';
}
}
function tdnorm(modetd,tdobj,textd){
if(modetd=='g'){
document.getElementById(tdobj).height=20;
document.getElementById(tdobj).innerHTML=textd;
}
else{
document.getElementById(tdobj).height=1;
document.getElementById(tdobj).innerHTML=' ';
}
}
function treee1(show)
{
if (show==1){
if (document.getElementById('td1').height==20){
document.getElementById('main').innerHTML='Hallo';
tdnorm('k','td1',"");
tdnorm('k','td2',' ');
tdnorm('k','td3',' ');
display('h','tree1');
}else{
display('h','tree2');
display('s','tree1');
tdnorm('g','td1','Martin');
tdnorm('g','td2','Katrin');
tdnorm('g','td3','Petra');
tdnorm('k','td4',' ');
tdnorm('k','td5',' ');
tdnorm('k','td6',' ');
}
}else{
tdnorm('k','td1',"");
tdnorm('k','td2',' ');
tdnorm('k','td3',' ');
display('h','tree1');
}
}
function treee2(show)
{
if (show==1){
if (document.getElementById('td4').height==20){
document.getElementById('main').innerHTML='Hallo';
tdnorm('k','td4',"");
tdnorm('k','td5',' ');
tdnorm('k','td6',' ');
display('h','tree2');
}else{
display('h','tree1');
display('s','tree2');
tdnorm('k','td1',' ');
tdnorm('k','td2',' ');
tdnorm('k','td3',' ');
tdnorm('g','td4','Dennis');
tdnorm('g','td5','Maarten');
tdnorm('g','td6','Flo');
}
}else{
tdnorm('k','td4',' ');
tdnorm('k','td5',' ');
tdnorm('k','td6',' ');
display('h','tree2');
}
}
function maintd(which){
switch(which) {
case '1':
var contentd=('Martin ist so beautiful');
break;
case '2':
var contentd=('Katriun ist 18 Jahre');
break;
case '3':
var contentd=('Petra ist superspitze');
break;
case '4':
var contentd=('Arschlecker@Hodenlecker.de');
break;
case '5':
var contentd=('Ich mag Käse');
break;
case '6':
var contentd=('Flo muss aufs Klo*sing*');
break;
}
document.getElementById('main').innerHTML=contentd;
}
</script>
</head>
<body>
<table>
<tr>
<td>
<table border=0 cellpadding=0 cellspacing=0 bgcolor=lightgrey>
<tr>
<td width=100 id=1 onClick="treee1(1);treee2(0);" onMouseover="mon(1)" onMouseout="mout(1)" bgcolor=#999999><center>Family</center></td>
</tr>
</table>
<div class=hohe style="visibility:hidden;" id="tree1">
<table height=0 border="0" cellpadding=0 cellspacing=0>
<tr>
<td bgcolor=#999999 width=100 id=td1 onMouseover="mon('td1')" onClick="maintd('1')" onMouseout="mout('td1')"></td>
</tr>
<tr>
<td bgcolor=#999999 width=100 id=td2 onMouseover="mon('td2')" onClick="maintd('2')" onMouseout="mout('td2')"></td>
</tr>
<tr>
<td bgcolor=#999999 width=100 id=td3 onMouseover="mon('td3')" onClick="maintd('3')" onMouseout="mout('td3')"></td>
</tr>
</table>
</div>
<table border=0 cellpadding=0 cellspacing=0 bgcolor=lightgrey>
<tr>
<td width=100 id=2 onClick="treee1(0);treee2(1);" onMouseover="mon(2)" onMouseout="mout(2)" bgcolor=#999999><center>Freunde</center></td>
</tr>
</table>
<div class=hohe style="visibility:hidden;" id="tree2" >
<table height=0 border="0" cellpadding=0 cellspacing=0>
<tr>
<td bgcolor=#999999 width=100 id=td4 onClick="maintd('4')" onMouseover="mon('td4')" onMouseout="mout('td4')"></td>
</tr>
<tr>
<td bgcolor=#999999 width=100 id=td5 onMouseover="mon('td5')" onClick="maintd('5')" onMouseout="mout('td5')"></td>
</tr>
<tr>
<td bgcolor=#999999 width=100 id=td6 onMouseover="mon('td6')" onClick="maintd('6')" onMouseout="mout('td6')"></td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td id=main>Hallo</td>
</tr>
</table>
</body>
</html>
