Problem mit Drop Down Menü

[yamahaboy_46]

Hallo

Ich habe ein massives Problem mit meinem Drop Down Menü in Typo3. Ich verwende Typo 4.5.3. Habe meine Navigation wie folgt aufgebaut: Ich weiß dass dies hier kein Typo3 Forum ist. Doch ich bin mir fast sicher dass mein Fehler im CSS oder HTML liegt.


HTML:

<div id="navigation">

<ul>

<li><a href="#" onfocus="blurLink(this);" >MENÜ 1</a>

<ul>

<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ</a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>
<li><a href="#" onfocus="blurLink(this);" >MENÜ </a></li>

</ul>

</li>

</ul>

</div>


CSS:
#navigation {
width:935px;
height:23px;
margin:0 auto;
position:relative;
border-style:solid;
border-color:#084792;
margin-top:120px;
}

#navigation ul {
margin: 0 auto;
padding: 0; width: auto;
float: left;
list-style-type:none;
}

#navigation ul li{
margin: 0;
padding: 0;
height: 35px;
float: left;
position: relative;
}

#navigation ul li a{
color: #084792;
font-size:14px;
font-family:Verdana, Geneva, sans-serif;
text-decoration: none;
padding-left:5px;
width:182px;
height:23px;
display: block;
float: left;
text-align:center;
font-weight:400;

}

#navigation ul li a:hover{
background:#dbdbdb;
}

#navigation ul li ul ul {
margin: 110px 0 0 65px;


}

#navigation ul li li {
width:auto;
height: 50px;
margin-top:-10px;

}

#navigation ul li li a {
text-transform: none;
display:block;
text-align:center;
background: #FFF;
width: 182px;
height:30px;
font-size:12px;
padding-top:10px;


}

#navigation ul li li a:hover{
/*background: none; */
background-color: #dbdbdb;
color:#FFF
left: 0;
width: 182px;
height:30px;
display:block;
}

#navigation ul li ul {
left: -999em;
top: 40px;
left: 0;
display: block;
height: 36px;
width: 85px;
position: absolute;
z-index: 99;
left: -999em;
clear:left;
margin-top: 0px;
margin-left: 0px;
}
#navigation ul li:hover ul ul, #topnav_beispiel ul li:hover ul ul ul { left: -999em; }
#navigation ul li:hover ul, #topnav_beispiel ul li li:hover ul, #topnav_beispiel ul li li li:hover ul { left: auto; }


Typo Script:

lib.navigation = HMENU
lib.navigation {
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul>|</ul>
expAll = 1
NO.wrapItemAndSub = <li>|</li>
}

### Zweite Ebene ###
2 = TMENU
2 {
wrap = <ul>|</ul>
NO.allWrap = <li>|</li>
}
}

Folgendes Problem:

Im Mozilla Firefox funktioniert die Navigation einwandfrei. Ich fahre über das Hauptmenü und das Unternmenü klappt herunter. Es bleibt auch stehen und ich kann die Unterpunkte ganz normal anwählen. Im IE funktioniert dies schon nicht mehr. Sobald ich auf den Hauptnavigationspunkt fahre, klappt zwar die Unternavigation aus, doch sobald ich auf einen Unterpunkt fahren will, klappt die Navigation wieder ein. Das gleiche Problem habe ich mit allen anderen Browsern auch. Einzig im Firefox klappt es einwandfrei.

Was kann da der Fehler sein?

mfg

[Guillermo]

Hi yamahaboy_46,

ich habe deinen Code nicht genau analysiert, vermute aber dass es daran liegt dass da ein kleiner Abstand zwischen deiner Hauptnavigation und den Unternavigationen besteht. Du fährst über einen Link, Unternavigation erscheint. Wenn du aber einen Link der Unternavigation anwählen willst, bewegst du die Maus über eine Lücke zwischen den beiden Navigationen. Das "hover" der Hauptnavigation ist also nicht mehr aktiv, drum verschwindet auch das Kindelement wieder. Eine Lösung wäre die Unternavigation etwas nach oben zu verschieben.
Wenn dieser Abstand gewollt ist und du ihn beibehalten bist, so verwende einfach bei der Unternavigation "padding-top" statt "margin-top". Ich hoffe es liegt daran, wenn nicht müssen wir uns das mal genauer anschauen.

Viele Grüße,
Guillermo

[yamahaboy_46]

Hallo Guillermo

Danke für die rasche Antwort. Aber wo soll ich patting-top in meinem Css reingeben?

mfg

[Guillermo]

Hi yamahaboy_46,

"padding-top" brauchst bzw. kannst du verwenden wenn du unbedingt einen Abstand zwischen Haupt- und Unternavigation haben willst.

Grüße,
Guillermo

[yamahaboy_46]

Hallo

Naja ich will den Abstand ja eigentlich gar nicht. Aber irgendwie bringe ich ihn nicht raus.

mfg

[yamahaboy_46]

Hallo

Also ich habe den Abstand jetzt weggebracht. Das war leider nicht der Fehler. Es funktioniert noch immer nicht. Das seltsame ist, dass es im Firefox, Opera, Chrom funktioniert nur im IE nicht.

mfg

[yamahaboy_46]

Hallo Leute

Anbei eine kurze Testseite mit dem identischen Sourcecode

http://www.paip.at/Testpage/

Anbei auch noch mein gesamter Typoscript Code:


config {
admPanel = 0
headerComment (
Diese Seite wurde erstellt von:
Test
)
doctype = xhtml_trans
xhtmlDoctype = xhtml_trans
htmlTag_langKey = de_DE
xhtml_cleaning = all
xmlprologue = none
disablePrefixComment = 1
index_enable = 1

baseURL = http://www.paip.at/Testpage/typo3

spamProtectEmailAddresses = ascii
spamProtectEmailAddresses_atSubst = (at)
simulateStaticDocuments = 1
simulateStaticDocuments_noTypeIfNoTitle = 1
removeDefaultJS = external
inlineStyle2TempFile = 1
noScaleUp = 1
meaningfulTempFilePrefix = 50
sys_language_uid = 0
language = de
locale_all = de_DE
}
[browser = msie]
config.doctypeSwitch = 1
[global]


lib.navigation = HMENU
lib.navigation {
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul>|</ul>
expAll = 1
noBlur = 1
NO.wrapItemAndSub = <li>|</li>
}
### Zweite Ebene ###
2 = TMENU
2 {
wrap = <ul>|</ul>
NO.allWrap = <li>|</li>
}
}

lib.footernav = HMENU
lib.footernav {
wrap = <ul>|</ul>

special = list
special.value = 51,52,53,54

1 = TMENU

1 {

NO = 1

NO {
allWrap = <li>|</li>
}



}
}
}


//page.shortcutIcon = fileadmin/templates/images/favicon.ico
page.meta {
author = test
robots = index,follow
revisit-after = 30 days
copyright = Heger Edelstahl
MSSmartTagsPreventParsing = true
imagetoolbar = false
//verify-v1 = //Hier der Code für die Google-Webmaster-Tools, falls benötigt//
}

Bitte schaut mal drüber, weil langsam bin ich ziemlich am Verzweifeln.

mfg