IE Problem (oder ich bin zu doof) mit Menü!

the_cRu

nabend,
also...

ich habe endlich ein ordentliches css/java menü gefunden, welches auch "fast" reibungslos funktioniert... der IE mal wieder, oder ich *fg

- das menü -

also, auf der seite funktioniert das menü ohne probleme im IE. aber nun habe ich es bei mir eingebaut und es kommt folgendes bei raus:

beim IE:
[IMG]http://img506.imageshack.us/img506/8064/iexe9.jpg[/IMG]

beim firefox (so wie es sein soll):
[IMG]http://img506.imageshack.us/img506/1508/fireow8.jpg[/IMG]

irgendwie finde ich den fehler nicht. hier einmal der code von der header.tpl:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:
206:
207:
208:
209:
210:
211:
212:
213:
214:
215:
216:
217:
218:
219:
220:
221:
222:
223:
224:
225:
226:
227:
228:
229:
230:
231:
232:
233:
234:
235:
236:
237:
238:
239:
240:
241:
242:
243:
244:
245:
246:
247:
248:
249:
250:
251:
252:
253:
254:
255:
256:
257:
258:
259:
260:
261:
262:
263:
264:
265:
266:
267:
268:
269:
270:

<script  type="text/javascript">
var temp, temp2, cookieArray, cookieArray2, cookieCount;

function initiate(){

  cookieCount=0;

  if(document.cookie){

    cookieArray=document.cookie.split(";");
    cookieArray2=new Array();

    for(i in cookieArray){
      cookieArray2[cookieArray[i].split("=")[0].replace(/ /g,"")]=cookieArray[i].split("=")[1].replace(/ /g,"");
    }

  }

  cookieArray=(document.cookie.indexOf("state=")>=0)?cookieArray2["state"].split(","):new Array();

  temp=document.getElementById("containerul");

  for(var o=0;o<temp.getElementsByTagName("li").length;o++){

    if(temp.getElementsByTagName("li")[o].getElementsByTagName("ul").length>0){

      temp2                                = document.createElement("span");
      temp2.className                        = "symbols";
      temp2.style.backgroundImage        = (cookieArray.length>0)?((cookieArray[cookieCount]=="true")?"url(images/menu_icons/menu_minus.gif)":"url(images/menu_icons/menu_plus.gif)"):"url(images/menu_icons/menu_plus.gif)";
      temp2.onclick=function(){
        showhide(this.parentNode);
        writeCookie();
      }

      temp.getElementsByTagName("li")[o].insertBefore(temp2,temp.getElementsByTagName("li")[o].firstChild)

      temp.getElementsByTagName("li")[o].getElementsByTagName("ul")[0].style.display = "none";

      if(cookieArray[cookieCount]=="true"){
        showhide(temp.getElementsByTagName("li")[o]);
      }

      cookieCount++;

    }
    else{

      temp2                                = document.createElement("span");
      temp2.className                        = "symbols";
      temp2.style.backgroundImage        = "url(images/menu_icons/menu_space.gif)";

      temp.getElementsByTagName("li")[o].insertBefore(temp2,temp.getElementsByTagName("li")[o].firstChild);

    }

  }

}



function showhide(el){

  el.getElementsByTagName("ul")[0].style.display=(el.getElementsByTagName("ul")[0].style.display=="block")?"none":"block";

  el.getElementsByTagName("span")[0].style.backgroundImage=(el.getElementsByTagName("ul")[0].style.display=="block")?"url(images/menu_icons/menu_minus.gif)":"url(images/menu_icons/menu_plus.gif)";

}



function writeCookie(){

  cookieArray=new Array()

  for(var q=0;q<temp.getElementsByTagName("li").length;q++){

    if(temp.getElementsByTagName("li")[q].childNodes.length>0){
      if(temp.getElementsByTagName("li")[q].childNodes[0].nodeName=="SPAN" && temp.getElementsByTagName("li")[q].getElementsByTagName("ul").length>0){

        cookieArray[cookieArray.length]=(temp.getElementsByTagName("li")[q].getElementsByTagName("ul")[0].style.display=="block");

      }
    }

  }

  document.cookie="state="+cookieArray.join(",")+";expires="+new Date(new Date().getTime() + 365*24*60*60*1000).toGMTString();

}
</script>

<table style="width:{$style['tableoutwidth']}" cellpadding="{$style['tableoutcellpadding']}" cellspacing="{$style['tableoutcellspacing']}" align="center" border="{$style['tableoutborder']}" class="tableoutborder">
 <tr>
  <td class="mainpage" align="center">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
    <tr> 
     <td class="logobackground" align="left"><if($style['logoimage']!="")><then><a href="index.php{$SID_ARG_1ST}"><img src="{$style['logoimage']}" border="0" alt="$master_board_name" title="$master_board_name" /></a></then></if></td>
    </tr>
</table>
 <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td class="mainpage" align="center">

<table style="width:99%" border="0" cellspacing="2" cellpadding="0">
<tr>
 <td valign="top">

<table cellpadding="4" cellspacing="1" border="0" style="width:180px;" class="tableinborder">
 <tr align="left">
  <td class="tabletitle">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td align="left"><span class="smallfont"><b>Menü</b> <if($wbbuserdata['a_can_use_acp']==1 && $wbbuserdata['a_acp_or_mcp']==0)><then>- <a href="acp/index.php" target="_blank">(Moderation)</a></then></if><if($wbbuserdata['a_can_use_acp']==1 && $wbbuserdata['a_acp_or_mcp']==1)><then>- <a href="acp/index.php" target="_blank">(Administration)</a></then></if></span></td>
    </tr>
   </table>
  </td>
 </tr> 
 <tr>
  <td class="tablea">
<span class="smallfont">

<ul id="containerul">

<li>&bull; <b>News</b>
    <ul>
     <li><a href="#">News aktuell</a></li>
     <li><a href="#">Archiv</a></li>
    </ul>
</li>

<br />

<li>&bull; <b>Community</b>
    <ul>
    <li><a href="index.php?sid=$session[hash]">Board</a> / <if($wbbuserdata['userid'])><then><a href="logout.php?sid=$session[hash]">Logout</a><br></then><else><a href="login.php">Login</a><br /></else></if></a>
       <ul>
       <li><li><if($wbbuserdata['userid'])><then><a href="profile.php?userid=$wbbuserdata[userid]&amp;sid=$session[hash]">Mein Profil</a> / <a href="usercp.php?sid=$session[hash]">Edit</a><br></then><else><a href="register.php?sid=$session[hash]"><b>Registrieren</b></a></else></if></li></li>
       <if($wbbuserdata['userid'])><then><li><li> 
</ul>  
  </li>    
     <li><a href="#">kurze version vom code</a></li>
    </ul>
</li>

<br />

<li>&bull; <b>Der Hass</b>
    <ul>
     <li><a href="#">kurze version vom code</a></li>
    </ul>
</li>

<br />

<li>&bull; <b>Interact</b>
    <ul>
     <li><a href="#">kurze version vom code</a></li>
    </ul>
</li>

   </ul>
<script type="text/javascript">
initiate();                // This must be placed immediately after the menu in order to format it properly.
</script>

     </span>
   </td>
 </tr>
</table>

<br />

<table cellpadding="4" cellspacing="1" border="0" style="width:180px;" class="tableinborder">
 <tr align="left">
  <td class="tabletitle">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td align="left"><span class="smallfont"><b>Info / Statistik</b></span></td>
    </tr>
   </table>
  </td>
 </tr> 
 <tr>
  <td class="tablea">
<span class="smallfont">

Platzhalter

</span>
   </td>
 </tr>
</table>

<br />


<table cellpadding="4" cellspacing="1" border="0" style="width:180px;" class="tableinborder">
 <tr align="left">
  <td class="tabletitle">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td align="left"><span class="smallfont"><b>Wer ist wo online?</b></span></td>
    </tr>
   </table>
  </td>
 </tr> 
 <tr>
  <td class="tablea">
<span class="smallfont">

Platzhalter

</span>
   </td>
 </tr>
</table>

<br />


<table cellpadding="4" cellspacing="1" border="0" style="width:180px;" class="tableinborder">
 <tr align="left">
  <td class="tabletitle">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td align="left"><span class="smallfont"><b>Werbung</b></span></td>
    </tr>
   </table>
  </td>
 </tr> 
 <tr>
  <td class="tablea">
<span class="smallfont">

Platzhalter

</span>
   </td>
 </tr>
</table>

<br />


<table cellpadding="4" cellspacing="1" border="0" style="width:180px;" class="tableinborder">
 <tr align="left">
  <td class="tabletitle">
   <table style="width:100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td align="left"><span class="smallfont"><b>Partner</b></span></td>
    </tr>
   </table>
  </td>
 </tr> 
 <tr>
  <td class="tablea">
<span class="smallfont">

Platzhalter

</span>
   </td>
 </tr>
</table>

<br />

</td>
<td align="center" valign="top" style="width:86%" >

zudem kommt die frage auf:
wenn ich nun das ganze eine tabelle nochmal (abgeändert, also evtl. ein zweites menü) haben möchte, wie gehe ich davor? wenn ich es einfach reinkopier funzt es gewissermaßen, nur speichert der das erste menü nicht mehr, also die stellung (offen/zu).

ich hoffe ihr könnt mir weiterhelfen! ...

LG