Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 20.11.2008, 09:15
infernalshade infernalshade ist offline
creativ.handwerk
neuer user
Thread-Ersteller
 
Registriert seit: 10.11.2008
Ort: 94357 Konzell
Beiträge: 79
infernalshade befindet sich auf einem aufstrebenden Ast
Standard GELÖST: IE6 Submenü Problem - WICHTIG!

Hallo Leute!

Erstmal der Code, dann sag ich euch was passiert:

Das Navigationsmenü:
HTML-Code:
<div class="mod_navigation block" id="nav">
<ul class="level_1">
<li class="active submenu first"><span class="active submenu first">BIO WAGYU</span><ul class="level_2">
<li  class="active first"><span class="active first">Bio Wagyu</span></li>
<li  class="last"><a href="ueber-wagyu.html" title="Über Wagyu" class="last" onClick="this.blur();"><span>Über Wagyu</span></a></li>
</ul>
</li>
<li  class="submenu"><a href="ueber-uns.html" title="Über uns" class="submenu" onClick="this.blur();"><span>ÜBER UNS</span></a><ul class="level_2">

<li  class="first"><a href="ueber-uns.html" title="Über uns" class="first" onClick="this.blur();"><span>Über uns</span></a></li>
<li  class="last"><a href="ueber-schergengrub.html" title="Über Schergengrub" class="last" onClick="this.blur();"><span>Über Schergengrub</span></a></li>
</ul>
</li>
<li><a href="gallerie.html" title="Gallerie" onClick="this.blur();"><span>GALLERIE</span></a></li>
<li><a href="referenzen.html" title="Referenzen" onClick="this.blur();">KUNDEN REFERENZEN</a></li>
<li><a href="links.html" title="Links" onClick="this.blur();"><span>LINKS</span></a></li>
<li  class="last"><a href="kontakt.html" title="Kontakt" class="last" onClick="this.blur();"><span>KONTAKT</span></a></li>
</ul>
</div>
Das CSS (Ich weis, der Code ist ziemlich durcheinander und evtl falsch, das kommt aber vom rumprobieren das ich schon die ganze Zeit mache!):
HTML-Code:
#nav
{
	left:-575px;
	top:40px;
	position:absolute;
	font-size:11px;
	z-index:999;
	*top:50px;
	overflow:visible !important;
}

#nav a,
#nav span
{
	display:block;
}

#nav ul
{
	list-style-type:none;
}


#nav li
{
	width:86px;
	margin-right:2px;
	text-align:center;
	background-image:url("tl_files/wagyu/img/nav-button-bg.jpg");
	background-repeat:no-repeat;
	float:left;
}

#nav li a
{
	color:#ffffff;
}

#nav li a:hover
{
	color:#ffa9ac;
}

#nav span.active
{
	color:#ffa9ac;
}

#nav ul ul
{
	visibility:hidden;background:#333333;position:absolute;top:44px;
	*border:5px solid green;
}

* html #nav ul ul
{
	margin-left:-50%;
}

*+html #nav ul ul
{
	margin-left:-100px;
}

#nav li:hover ul
{
	visibility:visible;
}

#nav ul ul li
{
	background:none;margin-left:-35px;margin-right:30px;width:116px;
	*margin-left:0px;*margin-right:0px;
}

#nav ul ul li span,
#nav ul ul li a
{
	text-align:left;float:left;line-height:20px;
}
Ok, also das Untermenü klappt wunderbar auf im Firefox und Co anhand diesen CSS-Stilen:
HTML-Code:
#nav ul ul
{
	visibility:hidden;background:#333333;position:absolute;top:44px;
	*border:5px solid green;
}
und
HTML-Code:
#nav li:hover ul
{
	visibility:visible;
}
Jedoch nicht im IE6! Aus diesem Grund hab ich bisher immer dieses Javascript verwendet, das es auch im IE6 zum funktionieren bringt:
HTML-Code:
/* IEFIX */
if(window.ie6 || window.ie7)
{	
        window.addEvent('domready',function(){
		$$('#nav li').each(function(el,cnt){
			if(el.getParent().hasClass('level_1') && el.getElement('ul'))
			{
				el.submenue = el.getElement('ul');
				
                                el.addEvent('mouseover',function(){
					this.submenue.setStyles({
						'visibility': 'visible'
					});
				});
				el.addEvent('mouseout',function(){
					this.submenue.setStyles({
						'visibility': 'hidden'
					});
				});
			}
		});
	})
}
Das Script funktioniert auch ganz gut, nur folgendes passiert mir jetzt beim IE6:

Wenn ich mit der Maus über den TEXT-Hyperlink fahre erscheint das Submenü, aber sobald ich nur 1px ausserhalb des Hyperlink-Textes bin verschwindet das Submenü wieder!

Das gleiche Script hab ich z.b. auch auf dieser Seite verwendet. Dort ist es so wenn ich über das <li> fahre (und nicht über den Hyperlink-Text) erscheint das Submenü und das schließt sich erst wieder wenn ich einmal mit der Maus im Submenü war und es dann wieder verlasse...

Was mach ich falsch, was hab ich anders gemacht!?

Bitte helft mir, die Seite ist sehr wichtig und sollte heute noch fertig werden!
Wär super wenn mir da jemand helfen könnte...

Grüße,
infernalshade

Geändert von infernalshade (20.11.2008 um 15:06 Uhr)
Mit Zitat antworten
Sponsored Links